このエリアは、「ホーム以外::本文上」ウィジェットでカスタマイズできます。
キャンペーンや特別なお知らせを掲載することができます。

ratio_3_2_mainimg.jpg

メイン画像によっては、上に乗っている文字の位置や色が合わないことがあります。
スタイルシートの知識があれば、管理画面から調整することができます。

位置を変える

管理画面の固定ページ一覧から、トップページ(カテゴリーなしの「index」ページ)の編集画面へ移動してください。
ページ下部の「オプション」をクリックすると、「コード」欄に文字位置のスタイルシート定義が書かれています。

文字サイズを変える場合は「font-size」を、文字位置を変える場合は「top」「bottom」の数字を変更してください。「width」や「left」を追加すると左右を空けることもできます。
なお、「top」「bottom」「width」は必ず、パーセント単位としてください。画面が伸縮したときにずれてしまいます。

色を変える

「コード」欄に以下のように追記すると、文字が白黒反転します。

.mainvisual .jumbotron .h1,
.mainvisual .jumbotron h1 {
    color: #333333;
    text-shadow: 0px 1px 6px rgba( 255, 255, 255, .75 );
}

.mainvisual .jumbotron:visited .h1,
.mainvisual .jumbotron:hover .h1,
.mainvisual .jumbotron:focus .h1,
.mainvisual .jumbotron:active .h1,
.mainvisual .jumbotron:visited h1,
.mainvisual .jumbotron:hover h1,
.mainvisual .jumbotron:focus h1,
.mainvisual .jumbotron:active h1 {
    color: #333333;
}

.mainvisual .jumbotron .jumbotron-caption {
    background: rgba( 255, 255, 255, .3 );
    color: #333333;
}

.mainvisual .jumbotron:visited .jumbotron-caption,
.mainvisual .jumbotron:hover .jumbotron-caption,
.mainvisual .jumbotron:focus .jumbotron-caption,
.mainvisual .jumbotron:active .jumbotron-caption {
    color: #333333;
}