Stinger5　カスタマイズ – ブログタイトルをヘッダー画像にする

ブログタイトルをヘッダー画像にする

Stinger5はデフォルトの構成として

・ブログタイトル（トップへリンクあり）
・ブログの説明
・ヘッダー画像（トップへリンクなし）

となっています。

これを

・ヘッダー画像（トップへリンクあり）
・ブログの説明

という構成にしてみたのでメモ。

デフォルトのヘッダー画像を削除もしくは非表示にする

WordPressの管理メニューで「外観」→「カスタマイズ」と移動しておきます。

デフォルトのヘッダー画像は削除するか非表示にします。

下記の画像のように「画像を非表示」ボタンを押下。

ヘッダー画像を用意する

ヘッダー画像を用意します。

推奨は　横幅：980px、高さ：250pxですが、横幅さえあっていれば良いでしょう。

「画像を選択」ボタンからアップロードできます。

この状態で保存をすると、下記のようにヘッダー画像が小さく表示されます。

style.cssを編集

この画像を大きくするためにstyle.sccを編集します。

.sitename img

の部分を修正するのですが、style.sccには2ヶ所あるので、どちらも修正しました。

●修正前1

.sitename img {
	max-width: 300px;
	margin: 0 auto;
}

●修正前2

.sitename img {
	max-width: 300px;
	margin: 0;
}

どちらも下記のように修正します。

●修正後

.sitename img{
	max-width: 100%;
}

そうすると下記のように完成します。

まとめ

参考にさせていただいたのは下記のサイト。

結構難しくカスタマイズするのかなぁと調べていたところ、簡単にできました。

STINGER5ファビコンやヘッダー画像をカスタマイズする方法 | ネットビジネスで起業して稼ぐ！30代妻子持ちが脱サラ田舎暮らし

 - wordpress