【STINGER8】サイトタイトルの横に画像を入れる方法

STINGER8(スティンガー8)の「サイトタイトルの横に画像を入れる方法」をご紹介します。

サイト名をイメージ画像にする方法は、検索するといくつか出てきたのですが、私は「サイト名はそのままテキストの状態で、その横に画像を入れる」ことをしたかったので、試してみました。

そして、実際にやってみたら出来たのでご紹介します。

サイトタイトルの横に画像を入れる方法

サイト名の横に画像を入れるためには、header.phpを編集します。子テーマでの編集をおすすめします。

1.サイト名に入れたい画像をアップロード

画像のサイズは50×50ピクセルくらいがベストかと思います。

試してみた画像

2.画像のURLを調べる

URLはメディア→ライブラリーから調べることができます。

3.header.phpに追記

header.phpの46行目<a href=”<?php echo esc_url( home_url( ‘/’ ~の後ろに、以下のコードをコピペします。

””の中に表示したい画像のURLを追記してください。
完成したコードはこのようになります。

4.完成

完成画像です。このようになりました。

なかなかイイ感じ

サイトアイコンも入れるとイイかんじに

ついでなので、サイトアイコンも入れました。
同じ画像なので、統一感が出てイイ感じになりました。

統一感が出てイイ感じ

サイトアイコンの入れ方

サイトアイコンの入れ方は簡単です。
「カスタマイズ」→「サイト基本情報」のサイトアイコンに画像をアップロードするだけです。
画像は512ピクセル以上のものを作成しておきます。