ドメイン設定

アンミリ教材で初めてブログを作ってFC2仕様のテンプレートの張替えしてみたが、なぜかヘッダー画像の上にブログタイトルが表示されて自作のヘッダー画像と被ってしまう。

 

今回はヘッダー画像からブログタイトルを消す方法のシェア

 

ヘッダー画像上にあるブログタイトルはSEOで重要なh2タグを使用しており、SEOを考えるのでしたら削除しない方がいいみた。

 

そのため、ブログタイトルが目立たないよう、表示される場所、文字のサイズなどを修正する方法を以下に記載。

 

まず、FC2ブログにログインし、左サイドバーにある「環境設定」の中の「テンプレートの設定」をクリックしてください。

 

すると、HTML・スタイルシートが編集できるページに移動しますので、スタイルシートの中にある以下の表記を見つけてください。

 

 

#headerh2 {
font-family: "HGP創英角ｺﾞｼｯｸUB", "ヒラギノ角ゴ Pro W7";
position:relative;
margin-top: -130px;
padding-left: 50px;
padding-right: 50px;
font-size: 24px;
font-weight: bold;
text-align: left;
text-decoration: none;
}

 

 

次に、上記を下記に修正ください。

 

 

#headerh2 {
font-family: "HGP創英角ｺﾞｼｯｸUB", "ヒラギノ角ゴ Pro W7";
position:relative;
margin-top: -150px;
padding-left: 50px;
padding-right: 50px;
font-size: 10px;
font-weight: bold;
text-align: right;
text-decoration: none;
}

 

以上で、ヘッダー画像上にあるブログタイトルを小さくし、画像右上にもっていくことができます。

※修正点

 

１．font-size

font-sizeは文字の大きさを指定する項目で既存の24pxを10pxまで下げ、文字の大きさを小さくしました。

 

２．margin-top

margin-topは文字の上からの場所を指定する項目で既存の-130pxを-150pxにし、文字の位置を20px上にもってきました。

 

３．text-align

text-alignは、水平方向の文字の揃え方を指定する項目で既存のleftをrightにし、文字を右揃えにしました。