style.cssの書き方｜テーマ情報の定義と書式ルール

2025.12.28

WordPress

WordPressテーマを作成・管理するうえで、style.css は非常に重要なファイルです。
見た目を制御するCSSファイルであると同時に、テーマそのものの情報を定義する役割も担っています。

この記事では、style.cssにおける

テーマ情報の正しい書き方
コメントヘッダーの書式ルール
よくある注意点
を、基礎から丁寧に解説します。

WordPressテーマ制作をこれから始める場合でも、迷わず正しく設定できる内容を目指しています。

style.cssとは何か

style.cssは、WordPressテーマに必ず含まれるファイルのひとつです。
主に次の2つの役割を持っています。

テーマのスタイル（CSS）を定義する
テーマ情報（名前・作者・バージョンなど）をWordPressに伝える

特に後者の「テーマ情報の定義」は、style.cssにしか書けない重要な要素です。

テーマ情報を定義するコメントヘッダー

WordPressでは、style.cssの先頭に記述された特定形式のコメントを読み取り、テーマ情報として認識します。

このコメントが正しく書かれていない場合、テーマが管理画面に表示されないこともあります。

style.cssの基本構成

style.cssの冒頭には、以下のようなコメントヘッダーを記述します。

/*
Theme Name: Sample Theme
Theme URI: https://example.com/sample-theme
Author: Sample Author
Author URI: https://example.com
Description: サンプル用のWordPressテーマです。
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sample-theme
*/

このコメントブロックが、WordPressにとってのテーマ定義情報になります。

各項目の意味と役割

Theme Name（必須）

テーマの名前を指定します。
WordPress管理画面に表示される名称です。

Theme Name: Sample Theme

※この項目がないと、テーマとして認識されません。

Theme URI（任意）

テーマの公式ページや紹介ページのURLを指定します。

Theme URI: https://example.com/sample-theme

Author / Author URI（任意）

テーマの制作者名と、そのサイトURLを指定します。

Author: Sample Author
Author URI: https://example.com

Description（任意）

テーマの簡単な説明文です。
管理画面のテーマ詳細に表示されます。

Description: サンプル用のWordPressテーマです。

Version（推奨）

テーマのバージョン番号を指定します。

Version: 1.0.0

アップデート管理やキャッシュ対策の観点からも、記述しておくことが推奨されます。

License / License URI（推奨）

テーマのライセンス情報を指定します。
WordPress公式テーマや配布テーマでは特に重要です。

License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html

Text Domain（必須）

多言語化（翻訳）対応に使用される識別子です。

Text Domain: sample-theme

通常はテーマフォルダ名と同じにします。

書式ルールと注意点

コメント形式は必ず「/* */」

テーマ情報は、*CSSコメント形式（/ */）**で記述する必要があります。
// コメントでは認識されません。

項目名は正確に書く

Theme Name や Text Domain などの項目名は、
スペル・大文字小文字を含めて正確に記述する必要があります。

style.cssはテーマ直下に配置する

style.cssは、以下の位置に配置されていなければなりません。

wp-content/themes/テーマ名/style.css

別フォルダ内にある場合、テーマ情報は読み取られません。

CSSはコメントの後ろに記述する

テーマ情報コメントの下に、通常のCSSを記述します。

/*
Theme Name: Sample Theme
...
*/

body {
  margin: 0;
  padding: 0;
}

コメントヘッダーとCSSは、同一ファイル内で問題ありません。

functions.phpとの役割の違い

style.cssは「テーマ情報と見た目」、
functions.phpは「機能や設定」を担当します。

それぞれの役割を正しく理解しておくことが重要です。

詳しくは、
functions.phpの役割と基本構成を解説した記事
をあわせて読むと理解が深まります。

よくある間違い

Theme Nameを書き忘れている
コメント形式が間違っている
Text Domainとフォルダ名が一致していない
style.cssの場所が間違っている

これらは、テーマが表示されない原因になりやすいため注意が必要です。

まとめ

style.cssは、単なるCSSファイルではなく、
WordPressテーマとして成立させるための定義ファイルです。

コメントヘッダーでテーマ情報を正しく定義する
書式ルールを厳守する
必須項目（Theme Name・Text Domain）を忘れない

これらを押さえることで、テーマ制作の土台が安定します。

あわせて読むことで、テーマ開発全体の理解がより深まります。