シリウス レスポンシブテンプレートのサイト説明文を上にあげたい

こんにちは。

シリウスのレスポンシブテンプレートを使うと、ヘッダ画像内にサイト説明分が入りきらなくて下にはみ出し、困ったことはありませんか?

シリウスのレスポンシブテンプレートで説明文が長いと枠内に入りきらない

CSS(スタイルシート)のtopとwidthを調整すれば解決できます

 

説明文がヘッダ画像からはみ出す

 

トップページやエントリーページの説明分が多いと

 

下の画像のように説明文がヘッダ画像からはみ出します。

 

位置を上にあげ幅を広げて解決

 

サイトのデザインを調整するのは、CSS(スタイルシート)というソースコードを修正して微調整します。

慣れないうちは、編集するcssをバックアップしてから調整するのが無難です。

バックアップはソースコードを丸ごとコピーしてどこかに退避させるだけでもいいと思います。

 

CSSを編集するのは、シリウスの編集タブからスタイルシートをクリックします。

 

 

1カラムのテンプレートですが、411行目位からヘッダ部のCSSを記述しているところがあります。

赤枠内を修正すると説明分の位置と幅を調整できますよ。

top :上の余白

width:タイトルと説明文の幅

 

 

上側余白のtopを80px → 55pxにして全体的に位置を上に移動します。

タイトルと説明文の幅を45% → 55%に増やして一行に入る文字数を増やします。

 

 

サイト説明分がヘッダ画像内に収まりました^^

 

 

ちょっとした小技ですが、知ってると知ってないとでは大きな違いすね。

知らなかった時は、ヘッダ画像に文字を入れて対応していました。

 

その際は、

サイトオプション > サイトデザイン > 文字サイズ・文字の位置タブから、ページタイトルとサイト説明分を非表示にしないと、画像と文字が被ります。

 

 

画像に全て文字を入れた方が、見栄えがいいですけどね。

 

 

コメントを残す

CAPTCHA


*