テーマを一から作成している時にカスタマイズの項目から画像を挿入してみたくなったのですが、もともと容易されている関数ではヘッダー部分と背景画像についての指定しかできないみたいです。
なので、テーマカスタマイズの欄に画像をアップロードしてセットする機能を追加してみます。
↓この欄の一番下に項目を追加します
functions.phpにテーマカスタマイズに追加した機能のコードを記述します。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
//画像をアップロードする関数 function set_image_cutomizer($wp_customize){ //テーマのセクション $wp_customize->add_section( set_img_section, array( 'title' => '画像のセット', //セクション名 'priority' => 1000, //カスタマイザー項目の表示順 'discription' => 'アップロードした画像をセットします。' //セクションの説明 )); //テーマ設定のグループ $wp_customize->add_setting('set_img_url'); //テーマカスタマイザー画面に表示されるフォームの入力要素 $wp_customize->add_control(new WP_Customize_Image_Control($wp_customize, set_img_url, array( 'label' => '画像のセット', //設定ラベル 'section' => set_img_section, //セクションID 'settings' => set_img_url, //セッティングID 'description' => '画像をアップロードすると指定箇所の画像が入れ替わります。', ))); } //カスタマイザーに登録 add_action('customize_register', 'set_image_cutomizer'); //セットした画像のURLを取得 function get_image_url(){ return esc_url(get_theme_mod(set_img_url)); } |
以下のように「画像のセット」という項目が追加されました。
最後にここでセットした画像を表示したい箇所で、URLを取得する関数を使用すれば画像を表示することができます。
|
1 |
<img src="<?php echo get_image_url(); ?>"> |
