メインスタイルシート(style.css)
2020.03.31
2020.04.02
TOPICS
翻訳元記事はこちらです。
style.css
は、すべてのWordPressテーマに必要なスタイルシート(CSS)ファイルです。ウェブサイトのページの表示(ビジュアルデザインやレイアウト)を制御します。
場所
WordPressがテーマのテンプレートファイルのセットを有効なテーマとして認識するためには、style.cssファイルがサブディレクトリではなく、テーマのルートディレクトリにある必要があります。
テーマにstyle.css
ファイルをインクルードする方法の詳細な説明は、スクリプトとスタイルの読み込みの「スタイルシート」のセクションを参照してください。
基本構造
WordPressでは、外観(テーマ)ダッシュボードパネルにテーマに関する情報を表示するために、style.cssのヘッダーコメント部分を利用しています。
例
以下は、style.cssのヘッダーコメント部分の例です。
/*
Theme Name: Twenty Seventeen
Theme URI: https://wordpress.org/themes/twentyseventeen/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Seventeen brings your site to life with immersive featured images and subtle animations. With a focus on business sites, it features multiple sections on the front page as well as widgets, navigation and social menus, a logo, and more. Personalize its asymmetrical grid with a custom color scheme and showcase your multimedia content with post formats. Our default theme for 2017 works great in many languages, for any abilities, and on any device.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentyseventeen
Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/
WordPress Theme Repositoryでは、このファイルの「バージョン」の後の数字を使って、テーマに新しいバージョンがあるかどうかを判断しています。
(*)が付いている項目は、WordPressテーマリポジトリのテーマに必要な項目です。
Theme Name(*) | テーマの名前 |
Theme URI | ユーザーがテーマについての詳細を知ることができるWebページのURL |
Author(*) | テーマを開発した個人または組織の名前。テーマ作成者のwordpress.orgのユーザー名を使用することをお勧めします。 |
Author URI | 作成者の個人または組織のURL。 |
Description(*) | テーマの簡単な説明 |
Version(*) | テーマのバージョン。X.X、X.X.Xの形式で記述します。 |
Lisence(*) | テーマのライセンス |
Lisence URI(*) | テーマのライセンスのURL |
Text Domain(*) | 翻訳に使用するテキストドメインの文字列 |
Tags | ユーザーがタグフィルターを使ってテーマを見つけられるようにするための言葉やフレーズ。タグの完全なリストは、テーマレビューハンドブックを参照してください。 |
Domain Path | テーマが無効化されている場合に、WordPressにどこに翻訳があるかを通知するために使用します。デフォルトは/languages です。 |
必要なヘッダーセクションの後、style.cssは通常のCSSファイルが持っているものを何でも含むことができます。
子テーマのStyle.css
テーマが子テーマの場合は、style.cssヘッダーにTemplate行が必要です。
/*
Theme Name: My Child Theme
Template: Twenty Seventeen
*/
子テーマの作成についての詳細は、子テーマのページを参照してください。