2022年04月25日
WP関数:add_theme_support()
この関数の説明
WP関数の add_theme_support() は、WordPressが持っている機能の利用宣言を行う関数です。
関数
add_theme_support( $feature, $arguments )
パラメータ
追加する下記のWordpress機能を指定します。
機能 | 解説 |
'title-tag' | ブラウザのタブに[タイトル]を自動表示させる。 |
'post-thumbnails' | アイキャッチ画像の利用宣言をする。 |
'post-formats' | 投稿フォーマットの利用宣言をする。 |
'custom-header' | カスタマイズ画面に[ヘッダーテキスト色]と[ヘッダ画像]の利用宣言をする。 |
'custom-background' | カスタマイズ画面に[背景色]と[背景画像]の利用宣言をする。 |
’custom-logo’ |
カスタマイズ画面に[ロゴ画像]の利用宣言をする。 |
'automatic-feed-links' | RSSフィードのリンク機能をONにする |
$arguments (配列)(オプション)
$featureのパラメータを指定します。
省略時はtrueが入ります
事例
ブラウザのタブに[タイトル]表示の利用を宣言します。
add_theme_support( 'title-tag' ); //タブにタイトル出力します
ブラウザのタブに下記形式で表示されます。
記事タイトル|サイト名
よってheader.phpの中に<title>タグは不要になります。
2.$featureに'post-thumbnails'を指定します。
文書画面に[アイキャッチ画像]の利用を宣言します。
①投稿ページと固定ページにアイキャッチ画像の利用を宣言する場合
add_theme_support( 'post-thumbnails' ); // アイキャッチ画像のON set_post_thumbnail_size( 150, 150 ); // デフォルトサムネールサイズの設定
■アイキャッチ画像のサイズ設定は set_post_thumbnail_size() を参照してください。
②投稿ページだけにアイキャッチ画像の利用を宣言する場合
add_theme_support( 'post-thumbnails' , array( 'post' )); set_post_thumbnail_size( 150, 150 ); // デフォルトサムネールサイズの設定
アイキャッチ画像の呼び出す関数は 一般テンプレート構造と関数 を参照してください。
3.$featureに'post-formats'を指定します。
投稿画面に[投稿フォーマット]の利用宣言をする。
$arguments = array( 'image' , ' video' ); add_theme_support( 'post-formats' , $arguments);
■上記は投稿フォーマットに[画像]と[映像]を追加した例です。
その結果、投稿画面に下記が追加されます。
[$arguments に指定できるキー]
指定するキー | 表示されるラベル |
'aside' | アサイド |
'image' | 画像 |
'video' | 動画 |
'quote' | 引用 |
'link' | リンク |
'gallery' | ギャラリー |
'status' | ステータス |
'audio' | 音声 |
'chat | チャット |
<フォーマットタイプで表示を切り替えるサンプル>
<?php $format = get_post_format();?> <?php if(!$format):?> <?php get_template_part( 'single', $format );?> <?php else:?> <!-- 標準の時の投稿ページの表示プログラムを記述します。--> <?php endif;?>
■上記のプログラムは標準以外のフォーマットが指定された場合は[single-フォーマット名.php]をインクルードする事例です。
■投稿に設定されている投稿フォーマットの取得はget_post_format()、PHPプログラムのインクルードはget_template_part()を参照してください。
4.$featureに'custom-header'を指定します。
カスタマイズ画面に[ヘッダーテキスト色]と[ヘッダ画像]の利用宣言をする。
①デフォルト設定でカスタムヘッダー機能をONにする
add_theme_support( 'custom-header' );
■上記は下記のデフォルト値が採用されたカスタムヘッダになります。
指定できるキー | 初期値 | 設定される機能 | |
画像 |
'width' | 0 | 画像の切り抜き幅を指定する
0 は幅では切り抜かない事を意味します。 |
'flex-width' | false | 'width' が 0以外で、これを true にすると、任意幅で画像の切り抜きができる様になります。 | |
'height' | 0 | 画像の切り抜き高さを指定する
0 は高さでは切り抜かない事を意味します。 |
|
'flex-height' | false | 'height' が 0以外で、これを true にすると、任意高さで画像の切り抜きができる様になります。 | |
'default-image' | '' | デフォルト画像のパス名を指定する | |
'random-default' | false | header_image()関数で画像を表示する時に利用します。
ランダム表示するか否かはマニュアルで指定します。 これをtrue にするランダム表示がデフォルトになります。 |
|
文字 | 'header-text' | true | ヘッダーテキスト色の機能を利用する
false で利用しない。 |
'default-text-color' | '' | 上記のテキスト色のデフォルト色を指定する | |
動画 | 'video' | false | true でヘッダに動画を許可
但し、この動画は900px以上のデバイスしか表示されません。 この設定を変更する場合はheader_video_settingsを参照して下さい。 |
「外観→カスタマイズ」画面に下記が追加されます。
■[色]メニュの下に[ヘッダーテキスト色]が追加されます
この色を変更するとヘッダの下記の文字色が変更できる様になります。
サイトタイトル:bloginfo( 'name' )
※注意:サイトタイトルにリンクが設定されている場合は色は変わりません。
キャッチフレーズ:bloginfo( 'description' )
■[ヘッダー画像]のメニュが追加されます。
②デフォルト設定でないカスタムヘッダ機能をONにする場合
下記設定は画像切り抜きOK、ビデオ登録OK、ヘッダーテキスト色をOFFにしたカスタムヘッダにします。
$param = array( 'width' => 100, 'flex-width' => true, 'height' => 30, 'flex-height' => true, 'video' => true, 'header-text' => false, ); add_theme_support('custom-header' , $param );
■2~5行目:ヘッダー画像は自由サイズで切り抜きができる様になります。
切り取った画像は新しい画像としてメディアの中に登録されます。
■7行目:テキストの色指定はできなくなります。
■6行目:動画は登録できる様に変更
メニュ名が[ヘッダ画像]から[ヘッダメディア]に変更になります。
<ヘッダー画像の表示サンプル>
<div id='slide_contener'> <?php if(!(is_home() || is_front_page())):?> <!-- ホームページ以外はパンくずを表示 --> <?php elseif(has_header_video()):?> <!-- 動画が設定されてるば、それを表示 --> <?php the_custom_header_markup();?> <?php elseif(has_header_image()):?> <!-- 画像が設定されていれば、それを総て表示 --> <div id='top_slide'> <?php foreach (get_uploaded_header_images() as $value): ?> <!-- 画像URLの呼び出し --> <img src='<?php echo esc_url($value['url']);?>' width='100%'> <?php endforeach;?> </div> <?php endif;?> </div>
■上記はヘッダ画像やビデオを判定して表示させるプログラムです。
尚、画像はスライドさせる為に総ての画像を取り込んでいます。
■上記で利用している関数は「テーマのカスタマイズ設定値の取得と表示関数」を参照してください。
5.$featureに'custom-background'を指定します。
カスタマイズ画面に[背景色]と[背景画像]の利用宣言をする。
①デフォルト設定でカスタムバックグラウンド機能をONにする
add_theme_support( 'custom-background' );
■上記設定で下記のデフォルト値が採用されたカスタムバックグラウンドになります。
指定できるキー | 初期値 | 設定される機能 |
'default-color' | '' | デフォルトのカラーを指定します。 |
'default-image' | '' | デフォルトの画像のURLを指定します。 |
「外観→カスタマイズ」画面に下記が追加されます。
■色の下に[背景色]が追加されます。 :
この色を変更すると「bodyクラス」の背景色の変更ができる様になります。
■背景画像のメニュが追加されます
この中に背景画像の設定と配置方法を指定します。
②デフォルト設定でないカスタムバックグラウンド機能をONにする
下記は背景画像のデフォルト値を設定しています。
$arguments = array( 'default-color' => '#f7f7f7', ); add_theme_support( 'custom-background' , $arguments);
<上記の設定を反映させる為に必要な事>
header.phpの中のbodyクラスの記述を下記にする必要があります。
<body <?php body_class(); ?>>
6.$featureに’custom-logo’を指定します。
カスタマイズ画面に[ロゴ画像]の利用宣言をする。
①カスタムロゴ機能をONにする
add_theme_support('custom-logo');
■サイト基本情報の下に[ロゴ]メニュが追加されます。
<カスタムロゴが設定されているか?等を判断するプログラム>
[header.php]への記述例。
<?php if(has_custom_logo()):?> <?php the_custom_logo();?> <?php else:?> <a id='logo' href='<?php echo get_home_url('/');?>'><?php bloginfo( 'name' ); ?></a> <?php endif;?>
■上記で利用している関数は「テーマのカスタマイズ設定値の取得と表示関数」を参照してください。
7.$featureに'automatic-feed-links'を指定します。
RSSフィードのリンク機能をONにする。
この機能をONにしておくと投稿が追加された時に、RSSフィールドリンクの利用者に投稿が追加されたことが連絡されます。
<利用例>
add_theme_support( 'automatic-feed-links' );
参考情報
add_theme_support()は functions.php に記述するだけで機能しますが、親テーマと合わせて管理する為に下記のアクションフック内で処理する事がお勧めです。
function ○○(){ // ここに追加機能を指定します } add_action('after_setup_theme' , '〇〇' );