アメブロのブログタイトルと説明文のカスタマイズ

今回はアメブロのブログタイトルの文字の大きさや色、それから説明文のカスタマイズ、位置調整の仕方までを紹介しておきます。それからついでにブログのタイトルや説明文を非表示にする方法も解説していきます。

また、タイトルや文字のフォントの変更は事前にこちらのカスタマイズをしておきましょう。
アメブロのフォントや文字、リンクの色を変更するカスタマイズ

スポンサーリンク
アメーバキング

ブログタイトルの文字の大きさや色と位置調整

まずはブログタイトルの文字の大きさと色を変更。CSSの一番下に次のコードを追加するだけです。

/* ブログタイトルの文字の大きさと色 */
.skinTitle,.skinTitle:visited,.skinTitle:hover,.skinTitle:focus {
font-size: 30px;
color: #000000;

これでブログタイトルの文字の大きさと色を変更できます。数値はお好みで変更して下さい。

ブログタイトルの位置調整

ブログタイトルの位置をずらしたい場合は次のコードもCSSの一番下に追加。

/* ブログタイトルの位置調整 */
.skinTitleArea {
 padding: 0px 0px 0px 0px; /* 上右下左の順 */
}

「padding」で余白を作る事ができます。時計周りに上、右、下、左の順番に数値を設定できます。

例えばタイトルを右に少しずらす場合は左に余白を作ればいいので「padding」の4番目の部分の数値を10pxとしておけば10px分右にずらす事ができるという感じです。

また、ブログタイトルを左寄せではなく右寄せにする場合は「padding」ではなく次のコードを追加。

/* ブログタイトルを右寄せに */
.skinTitleArea {
 text-align: right;
}

同じ要領でブログタイトルを中央に配置したい場合はこんな感じ。

/* ブログタイトルを中央に */
.skinTitleArea {
 text-align:center;
}

説明文の文字の大きさと色を変更する

説明文もブログタイトルと全く同じ要領なので細かい説明は省いて解説していきます。まずは文字の大きさと色の変更。

/* ブログ説明文の文字サイズと色 */
.skinDescription {
 font-size: 14px;
 color: #000000;
}

それから説明文の位置調整。

/* ブログ説明文の位置調整 */
.skinDescriptionArea {
 padding: 0px 0px 0px 0px; /* 上右下左の順 */
}

ブログの説明文の右寄せ。

/* ブログ説明文を右寄せに */
.skinDescriptionArea {
 text-align: right;
}

それから説明文を中央に配置する場合。

/* ブログ説明文を中央に */
.skinDescriptionArea {
 text-align: center;
}

ブログタイトルと説明文を非表示

アメブロにヘッダー画像を付けるカスタマイズも紹介していますが、ヘッダー画像を使う場合にブログタイトルや説明文が邪魔になる場合がありますよね。

その場合にブログのタイトルと説明文を非表示にする方法です。削除ではなくて非表示ね。この違いは訪問者には見えないがブログのソースをみると見れるという意味で検索エンジンだけに見えるというイメージです。

ブログタイトルや説明文を非表示というのは個人的には好きではないですが一応紹介だけしておきます。

/* ブログタイトル非表示 */
#header h1,.skinTitleArea{
 display:none;
}
/* ブログ説明文非表示 */
#header h2,.skinDescriptionArea{
 display:none;
}

以上ブログタイトルと説明文のカスタマイズはこれで終了。次回はアメブロにグローバルナビを設置する方法を解説していきます。

WordPressの始め方
サイトのアクセスアップや稼ぐためにおすすめの無料レポート

個人的にアクセスアップや検索上位表示に役立った無料レポートです。登録にメールアドレスが必要ですが、フリーメールでもOKです。

おすすめの無料セミナー

これまでお金に関する勉強をした事がない方は稼ぐサイト作りの前にお金に関する無料セミナーに参加してみて下さい。お金をためたり増やしたりするためにお金の知識があるとかなり有利。考え方の土台になる部分ですからね。

「1万円から始められる節約の方法」「お金に働いてもらう方法」「収入の2割を自動的に貯める方法」など、お金に関する基本的な知識が学べる2時間の無料のセミナーが毎日のように行われてますので、一度参加してみる事をおすすめします。

これまで全くお金の勉強していない方であればお金の知識を身につける事で考え方が大きく変化するはずです。無料の2時間程度のセミナーですが、内容は濃いのでおすすめです。
お金に関する教養無料セミナー

※入院生活から復活しました!!またできるだけ返信しますのでよろしくお願いします(^^)

内容に問題なければ、下記の「コメントを送信する」ボタンを押してください。