【THE THOR】インデックスページのバナーのカスタマイズ

アイキャッチ画像 THE THOR(ザ・トール)
スポンサーリンク

WordPressテーマ THE THOR

別ブログのZMASAa.blogは、WordPressテーマ THE THOR(ザ・トール)を使って構築しています。

The main blog of masaa powered by WordPress.
スマホ、ガジェット、食玩などの記事をWordPressブログに毎日更新中!中の人はこれでもパパ。

今回、WordPressテーマ THE THOR(ザ・トール)の「インデックスページのバナー」に関するカスタマイズについてまとめてみました。

WordPress THR THOR インデックスページのバナー

WordPressテーマ THE THOR(ザ・トール)の「インデックスページのバナー」の表示は次の様になっています。

【THE THOR】インデックスページのバナーのカスタマイズ

バナー自体は特に問題ないのですが、バナー下の間隔が空き過ぎてバランスが悪くなっています。

と言う事で、ちょっとした「インデックスページのバナー」のカスタマイズを行ってみました。

インデックスページのバナーのカスタマイズ

「インデックスページのバナー」のカスタマイズを行います。

カスタマイズ内容

「インデックスページのバナー」のカスタマイズは、下記の通りです。

このカスタマイズ内容を「スタイルシート(style-user.css)」に追記します。

/************************************
** ■インデックスページ(トップページ)の上バナー調整
************************************/
.divider, .dividerBottom {
	margin-bottom: 20px !important; /*外側余白設定*/
}

カスタマイズ後のインデックスページのバナー

今回の「インデックスページのバナー」のカスタマイズによって、「インデックスページのバナー」は次のようになりました。

【THE THOR】インデックスページのバナーのカスタマイズ

今回の「インデックスページのバナー」のカスタマイズで、インデックスページ(上)に表示しているバナーに対して上下間隔を調整してみました。

最後に

インデックスページに表示するバナーによって間隔が違ってくるので、その辺り臨機応変に対応することになると思いますが、インデックスページは最初に表示されるトップページ(ブログサイトへの入り口)なので、バランス良く表示させたいものです。

コメント