style.cssのコメントヘッダーを理解しよう｜WordPressテーマに必須の情報とは？

16

Views

style.cssのコメントヘッダーの書き方

WordPressでテーマを作成するときに必ず必要なのが、style.cssのコメントヘッダーです。
このヘッダー部分に正しい情報を書いておくことで、WordPressに「これはテーマです」と認識させることができます。

この記事では、コメントヘッダーの役割や記述例、エラーにならないためのポイントなどを初心者向けにわかりやすく解説します。

コメントヘッダーとは？

style.cssの冒頭にある以下のような部分を「コメントヘッダー」と呼びます：

/*
Theme Name: My Original Theme
Theme URI: https://example.com/
Author: あなたの名前
Author URI: https://example.com/
Description: オリジナルのWordPressテーマです。
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: my-original-theme
Tags: custom-theme, responsive, simple
*/

この部分はWordPressがテーマとして認識するために必要な情報で、テーマの情報パネルや管理画面での表示に使われます。

各項目の意味

  • Theme Name：テーマの名前（日本語OK）
  • Theme URI：テーマの詳細情報ページ（なくてもOK）
  • Author：作成者の名前
  • Author URI：作成者のWebサイト
  • Description：テーマの説明
  • Version：バージョン番号（例：1.0）
  • License / License URI：ライセンス情報（GPLを推奨）
  • Text Domain：翻訳ファイル用の識別名（テーマ名と一致させるのが一般的）
  • Tags：公式テーマディレクトリ用のタグ（省略可能）

よくあるエラーと注意点

  • Theme Nameがない：WordPressがテーマと認識してくれない
  • コメントの閉じ忘れ：*/がないとCSSとして無効になる
  • style.cssがテーマ直下にない：必ずテーマフォルダ直下に設置

子テーマのコメントヘッダー例

子テーマを作成する場合は、以下のように「Template」を指定する必要があります：

/*
Theme Name: My Child Theme
Template: twentytwentyfour
Description: Twenty Twenty-Fourの子テーマです。
Version: 1.0
*/

Templateには、親テーマのフォルダ名（例：twentytwentyfour）を記述します。

おわりに

style.cssのコメントヘッダーは、テーマを正しく動作させるための「名刺」のようなものです。
一見ただのコメントに見えますが、WordPressがテーマ情報を読み込む大切な仕組みになっています。

ぜひ正しい書き方を身につけて、オリジナルテーマや子テーマの作成に役立ててください！

関連記事