WordPressでは、無料・有料問わず多数のテーマが公開されています。公開されているテーマでそのまま運用することも可能ですが、テーマをカスタマイズして使用したい場合があります。しかし、カスタマイズするために、公開されているテーマのファイルを直接編集してしまうと、テーマのアップデートを行う都度、カスタマイズした内容が元テーマの内容に上書きされてしまいます。そのため、公開されているテーマをカスタマイズするためには子テーマを作成しましょう。今回は、子テーマの作成方法については割愛しますが、子テーマのカスタマイズ例として、子テーマに独自の「Favicon」を追加する方法をご紹介します。
WordPressの子テーマに「Favicon」を追加する方法
「Favicon」は<head></head>
タグ内に追加する必要がありますが、WordPressの場合、同タグは通常header.php
内に記述します。よく、WordPressのカスタマイズ例で「Favicon」を追加する方法として、<head></head>
タグ内に、以下のタグを追加する方法が紹介されています。
しかし、子テーマで<head></head>
タグ内に上記タグを追加しようとすると、親テーマのheader.php
を修正するか、子テーマに新規にheader.php
ファイルを作成し、親テーマの内容をそのまま転記し、<head></head>
タグ内に上記のタグを追加することです。
しかし、どちらの方法も一長一短です。前者の方法は楽ですが、冒頭でご紹介した通り、テーマのアップデートが配信されるたびにファイルを修正する必要があり、カスタマイズしたことを忘れてしまう可能性があります。後者の方法は、親テーマのアップデートに影響は受けませんが、親テーマのアップデート時に合わせて子テーマ側のheader.php
ファイルを修正しないと、アップデートで不整合が生じる可能性があります(header.php
ファイルを子テーマに作成した場合、親テーマの同ファイルは読み込まれません)。
そこで、親テーマのアップデートの影響も受けず、子テーマに親テーマの内容を転記することなく、独自に「Favicon」を追加するためには、子テーマのfunctions.php
に以下を追記します。functions.php
は、親テーマ、子テーマで独立しているため(厳密には、子テーマのfunctions.php
が読み込まれた後に、親テーマの同ファイルが読み込まれます)、影響を受けません。
add_action(
'wp_head', function() {
echo '<link rel="shortcut icon" href="' . get_stylesheet_directory_uri() . '/favicon.ico"/>';
}
);
ポイントは、wp_head()
関数をフックすることと、get_stylesheet_directory_uri()
関数を使用することです。使用しているテーマのパスを取得するためには、通常get_template_directory_uri()
関数を使用しますが、子テーマで同関数を使用してしまうと、親テーマのパスが取得されてしまいます。そのため、子テーマでは、get_stylesheet_directory_uri()
関数を使用しましょう。これで、親テーマのheader.php
を修正することなく、かつ親テーマに影響を受けず子テーマをカスタマイズできます。