*

大好きなガジェット、ゲーム、写真、映画、ブログ運営などの情報をお届けする、くねおのライフログブログ

STINGER5でトップページにオリジナルのヘッダー画像を表示させる

      2015/10/09

ヘッダー画像はサイトの看板だと思う。
人のサイトを見ると、やはり1番最初に目に飛び込んでくるし、
そこからだいたいサイトの雰囲気が伝わってくるように感じる。

と、いうことでウチのサイトもオリジナルのヘッダー画像に張り替えよう!

オリジナルヘッダー画像の設定

これはめっちゃ簡単。

まず、横980px、縦250pxのヘッダー画像を用意する。

でーーん!

kr-header01

なんか怪しい感じがするけど、まあいいか。

WordPressのダッシュボードから設定する。
“外観” → “ヘッダー”をクリックする。

20150701_setting_header01
“新規画像を追加”をクリックする。

20150701_setting_header02
“ファイルをアップロード”をクリックして
下の画面にヘッダー画像をドロップ&ドラッグで放り込む。

20150701_setting_header03
“選択して切り抜く”をクリックして
次の画面で”切り抜かない”をクリックする。

20150701_setting_header04
最後に”保存して公開”をクリックする。

20150701_setting_header05

 

 

トップページのみヘッダー画像を表示させる

無事、ヘッダー画像を表示出来るようになったが、
さすがに各ページでこの画像を表示されるのは気が引ける。

そこで、トップページのみ表示出来るように変更する。

ここでいよいよ、作成した子テーマちゃんをいじくり回すんや。

子テーマ内のheader.phpをローカルにダウンロードする。
テキストエディタで開き、以下のヘッダー画像の出力部分のコードを探す。

このコードをif文で挟んで以下のコードにする。

 

こんだけ。
header.phpを保存してFFFTPで子テーマフォルダにアップロードして、
最後に、きちんと表示出来るか確認しておわり!

 - ブログ運営 , ,

スポンサーリンク


1番上へ