アメブロのブログタイトルを画像(タイトルロゴ)化する方法

  • 投稿 : 2012-06-22
  • 更新 : 2013-05-13
※カスタム可能/CSS編集用デザイン(新スキン)用です

ブログのタイトルを画像に置き換える方法です。タイトル画像(タイトルロゴ)を作成して置き換え、もともとあるタイトル文字とブログの説明を消すことで実現します。

サンプルで使用したのは以下のタイトル画像です。

CSSへの追加

デザインの変更のCSSの編集の最後に追加してみてください
.skinHeaderArea{
  height:78px; /*タイトル画像の高さ*/
  background-image:url(タイトル画像のURL);
  background-repeat:no-repeat;
  background-position:left top; /*左寄せ*/
}

.skinBlogHeadingGroupArea{
 display:none; /*ブログタイトルと説明を消す*/
}
78pxの部分を実際に作成されたタイトル画像の縦幅に変更してくださいね。
新スキンの場合は、横幅が980pxのようなのでこれに収まるようなタイトル画像にしてください。
タイトル画像のURLが正しいかどうかがわからない場合は、このURLをブラウザーで入力して画像が表示されることで確認が可能です。

スポンサーリンク