Genesis のテーマをカスタマイズするとき、Genesisフレームワークなどのカスタマイズに慣れていない人にオススメなのが、カスタマイズ用のPHPファイルやCSSファイルを作ってしまうことです。
カスタマイズの内容によっては、別のファイルを編集しなければならない場合もありますが、一度カスタマイズ用のファイルを作ってしまえば、より安全にGenesisサイトをカスタマイズできるようになります。
目次
カスタマイズ用PHPファイルの作り方
1 custom-functions.phpを作成
custom-functions.php
という名前のPHPファイルを新規作成し、以下のコードを追加します。
<?php
2 FTPでアップロード
①で作ったcustom-functions.phpを、FTPでGenesis子テーマのフォルダにアップロードします。
3 custom-functions.phpを読み込み
アップロードしたcustom-functions.phpは、そのままでは動かないので、Genesis子テーマのfunctions.php
に以下のコードを追加します。
//* カスタマイズ用PHPファイルの読み込み
include_once( 'custom-functions.php' );
カスタマイズ用のPHPファイルはこれで完成です。カスタマイズ用のコードを追加するときには、上から順にコードを追加すれば大丈夫です。
カスタマイズ用CSSファイルの作り方
1 custom-style.cssを作成
custom-style.css
という名前のCSSファイルを新規作成します。
2 FTPでアップロード
①で作ったcustom-style.cssを、FTPでGenesis子テーマのフォルダにアップロードします。
3 custom-style.cssを読み込み
アップロードしたcustom-style.cssも、そのままでは動かないので、Genesis子テーマのfunctions.php
に以下のコードを追加します。
//* カスタマイズ用CSSファイルの読み込み
add_action( 'wp_enqueue_scripts', 'custom_enqueue_style' );
function custom_enqueue_style() {
wp_enqueue_style( 'custom-style', get_stylesheet_directory_uri() . '/custom-style.css' );
}
これでカスタマイズ用CSSファイルの読み込みも完了です。
読み込めているかどうか確認してみる
一応ちゃんとカスタマイズ用のファイルが読み込めているか確認してみましょう。
1 カスタマイズ用PHPファイルの確認
custom-functions.php
に以下のコードを追加します。
add_action( 'genesis_site_title', 'gwpf_test' );
function gwpf_test() {
die();
}
カスタマイズ用のファイルが問題なく読み込めていれば、下の画像のようにサイトタイトル以降が非表示になるはずです。
2 カスタマイズ用CSSファイルの確認
custom-style.css
に以下のコードを追加します。
こちらも問題がなければ、画面が真っ白になります(違いが分かりやすいものなら、下のコード以外のものでも大丈夫です)。
body {
display: none;
}
3 うまく読み込まれない場合
上のPHPコードやCSSコードを入力しても、うんともすんとも言わない場合は、以下をチェックしてみて下さい。
- ファイル名などのスペルが合っているか
- 全角スペースがコードに入っていないか、
<?php
が入っているか(PHPファイルの場合)