カスタムヘッダーを使ってヘッダー画像を複数入れてみよう

「WordPress(ワードプレス)Tips」は、 WordPressテーマ&プラグイン販売 コミュニティコムショップが、 WordPressを使うために知っておきたいノウハウやヒントを解説するシリーズです。

Stacker Lite

今日は、WordPressでWebサイトを作るにあたって、使いたいテーマにヘッダー画像の挿入場所がない場合の設置の仕方をご紹介します。
今回は、コンテンツや写真をグリッド状に配置できる、とっても素敵なテーマ「Stacker Lite」をお借りして実装してみようと思います。


それでは、まずはBefore/Afterの確認から。

custom-header-before

before

custom-header-after

after

成功すれば、可愛いチワワのヘッダー画像が入りそうです。

早速はじめましょう。
手順は下記のとおり。

1.管理画面>外観>テーマの編集>テーマのための関数をひらく

テーマのための関数

2.任意の場所に下記文言を挿入する

add_theme_support( 'custom-header' );
検証画面

わたしは、メニューバーとタイトルの間に挟もうと思います。
この辺でしょうか。

カスタムヘッダー挿入場所

挿入します。

3.画像の挿入

外観>ヘッダー

上記の手順通りに進むと、「外観」の下階層に「ヘッダー」という項目が現れます。

ヘッダー画像

あとは簡単ですね。
「ヘッダー画像」の項目を選び…

新規画像を追加

「新規画像を追加」するだけです。
私は何枚か追加し、ランダムで表示されるようにしました。

以上となります!
ぜひ試してみてください。

WordPress(ワードプレス)テーマ&プラグイン販売 コミュニティコムショップでは、弁護士・法律事務所・士業向け WordPress テーマや、歯科医院・歯医者さん向け WordPress テーマなど、 ご購入から30日間の無料サポート付きWordPressテーマを販売しています。もちろん新エディター「Gutenberg(グーテンベルク)」対応です。
>> コミュニティコムショップのWordPressテーマ一覧

また、テーマをご購入いただいたお客様に向けて、テーマに関する単発または継続的なサポートプランもご用意しております。
>> コミュニティコムショップのサポートサービス一覧