【WordPress】テーマを自作する時には必ず設定しておきたい「add_theme_support」を紹介

WordPressのテーマを自作するとき、titleタグをページ毎のタイトルを反映するように設定したりフィードのリンクを記述するのって面倒ですよね。
また、何も設定しないとアイキャッチが使えなかったりと、何かと不便です。

ここでは、テーマを自作する上で最低限設定しておきたいテーマサポート「add_theme_support」を紹介します。

設定ソース例

下記コードをテーマの「functions.php」に追記します。

function hogehoge_setup() {
	add_theme_support( 'title-tag' );
	add_theme_support( 'post-thumbnails' );
	add_theme_support( 'automatic-feed-links' );
	add_theme_support( 'wp-block-styles' );
	add_theme_support( 'responsive-embeds' );
	wp_enqueue_style( 'tempcss-style', get_stylesheet_uri() );
}

add_action( 'after_setup_theme', 'hogehoge_setup' );

説明

タイトルタグの追加

add_theme_support( 'title-tag' );

titleタグを自動的に設置してくれる設定です。
HOMEであれば、「設定」＞「一般」で設定されている
『サイトのタイトル – キャッチフレーズ』が設定されます。
固定ページなどでは『ページのタイトル – サイトのタイトル』として設定されます。

アイキャッチ画像設定の追加

add_theme_support( 'post-thumbnails' );

固定ページや投稿の管理画面で「アイキャッチ画像」を設定する機能が追加されます。

フィードリンクの表示

add_theme_support( 'automatic-feed-links' );

Gutenbergが用意しているCSSを反映させる

add_theme_support( 'wp-block-styles' );

新しくなったブロック単位での編集画面『Gutenberg』が予め用意している「飲用」や「テーブル」などの一部のブロックで編集専用のスタイルを、公開画面でも同じく表示するようにしてくれます。

iframeをレスポンシブ対応

add_theme_support( 'responsive-embeds' );

Youtubeなどの埋め込み画像の縦横比を整えて表示してくれます。

style.cssを反映

wp_enqueue_style( 'tempcss-style', get_stylesheet_uri() );

これが無いと、折角用意したstyle.cssも反映されません。
add_theme_supportではありませんが、「after_setup_theme」でテーマの設定をするので併せて設定されるよう含めておくとスマートです。

判断は人それぞれですが、私は以上の機能追加であれば何とかテーマ自作できると思います。

他にも色んな設定があります。
「外観」＞「カスタマイズ」などの編集機能追加もできるようですが、諸々調整が必要なようですし、自作テーマであればデザイン・コーディングはできていると思うので「カスタマイズ」の管理機能は必要ないかと思ってます。
気になる方はググるといろいろ出てきますので、必要に応じて追加するのも良いと思います。