質問: 掲題通りなのですが、固定ページごとにCSSを読み込ませたいのですが分かりません。 調べてはいるのですが解決できず質問させていただきました。 分かる方ご教授いただけたら幸いです。 もしくは初心者でも分かるサイトがあれば教えていただけると大変嬉しいです。 よろしくお願いいたします。
回答: こんにちは。 投稿や固定ページなど、ベージごとに異なった CSS を適用させたい場合は、各ページに用意されているカスタムフィールドを使います。 デフォルトでない CSS を適用させたいページの編集画面にカスタムフィールドが表示されていない場合は、ページ左上の「表示オプション」を開いて「カスタムフィールド」にチェックをいれてください。 1)カスタムフィールドを使用する準備として、functions.php に必要事項を追記する functions.php の任意の場所に ``` /* カスタムフィールドで外部CSSを読み込む */ function include_custom_css(){ if(is_single()||is_page()){ if($css = get_post_meta(get_the_ID(), 'includeCSS', true)){ echo "\n"; } } } add_action('wp_head','include_custom_css'); ``` を記述してください。 2)個別のページの編集画面でカスタムフィールドを追加する 編集画面の下方にあるカスタムフィールドで、「名前」に「includeCSS」を、「値」に適用したい CSS の絶対パス(例 http://example.jp/wp-content/themes/mytheme/css/new-style.css)を入力し、「カスタムフィールドを追加」をクリックした後、ページの更新を行ってください。 ※ new-style.css(ファイル仮名)でスタイルを記述する際の注意 たとえば、元のテーマの style.css で「h2」が ``` .entry-content h2 { color: black; } ``` と記述されていた場合、new-style.css で「h2」に「red」を指定したい際には ``` .entry-content h2 { color: red; } ``` と上書きするかたちで記述しなければなりません。個別ページで適用したいスタイルに変化がない場合は、元のテーマの style.css にどのような id や class が指定されているかを確認してください。 以上、ご参考いただければ幸いです。