今日はＰｈｏｔｏＬｅｓｏｏｎでした＾＾*
（また後日ご報告しますね☆）
その時に、
「ブログのメニューバーはどうやって作るのかな？？」
というご質問を受けましたので
私のブログの設定方法になりますが、
こちらでご紹介しますね♪
【ブログメニューバー設置方法☆】
①「ブログ管理」画面
「ブログデザイン」の「デザインの変更」を選択。
↓
「カスタム可能」を選択。
②「ＣＳＳ編集用デザイン」を選択。
③「ＣＳＳの編集をする」をクリック。
④いろいろソースが書いてあるページに来ました。
一番下の空欄になるまでず～～と移動！
⑤空欄に下記のソースをコピー＆ペーストしてくださいね。そして、保存！
↓↓↓
/* ▼アメブロにメニューを設置する（以下そのままコピペでOK） */
.skinContentsArea{
position:relative;
}
#headerMenu{
position:absolute;
margin:0;
padding:0;
}
#headerMenu ul.menu{
margin:0;
padding:0;
list-style: none;
}
#headerMenu ul.menu li{
display:inline;
}
#headerMenu ul.menu li a{
display:block;
float:left;
margin:0;
padding:0;
white-space:nowrap;
overflow:hidden;
text-align:center;
}
/* ▼メニュー全体の幅・高さ・位置（好みに合わせて変更可）*/
.skinContentsArea{
padding-top:40px; /* メニューの高さ */
}
#headerMenu{
top:0px; /* メニューの配置（上部） */
left:0px; /* メニューの配置（左側） */
width:980px; /* メニュー全体の幅 */
}
/* ▼メニューの個々の幅・高さ・文字サイズ（好みに合わせて変更可）*/
#headerMenu ul.menu li a{
width:196px; /* ボタンの幅 */
line-height:40px; /* ボタンの高さ */
font-size:14px; /* ボタンの文字サイズ */
}
/* ▼メニュー（通常時）の高さ・幅・色などの調整（好みに合わせて変更可） */
#headerMenu ul.menu li a{
width:196px; /* メニューの幅 */
line-height:40px; /* メニューの高さ */
font-size:14px; /* メニューの文字サイズ */
color:#ffffff; /* 文字色(白) */
font-weight:bold; /* 太字(適用) */
text-decoration:none; /* 下線(なし) */
background-color:#CCCCCC; /* 背景色(灰色を適用中) */
background-image:url(); /* 背景画像 */
background-repeat:repeat; /* 背景画像繰り返し */
}
/* ▼メニュー（カーソルが乗った時）の高さ・幅・色などの調整（好みに合わせて変更可） */
#headerMenu ul.menu li a:hover{ /* カーソルが乗った時 */
color:#ffffff; /* 文字色(白) */
font-weight:bold; /* 太字(適用) */
text-decoration:underline; /* 下線(あり) */
background-color:#CCCCCC; /* 背景色(薄灰色を適用中) */
background-image:url(); /* 背景画像 */
background-repeat:repeat; /* 背景画像繰り返し */
}
.skinArticle {/*記事全体（タイトルも日付も記事も）の中央寄せ*/
text-align:center;
}
⑥保存完了したら、「ブログ管理」画面に。
サイドバー「設定・管理」
↓
「フリースペース」の「編集」をクリック。
⑦空欄に下記ソースをコピー＆ペースト。そして、保存。
↓↓↓
<div id="headerMenu"><!--
--><ul class="menu"><!--
--><li><a href="http://kodomotocamera.com " target="_blank">いちご</a></li><!--
--><li><a href=" http://kodomotocamera.com " target="_blank">りんご</a></li><!--
--><li><a href=" http://kodomotocamera.com " target="_blank">みかん</a></li><!--
--><li><a href=" http://kodomotocamera.com " target="_blank">めろん</a></li><!--
--><li><a href=" http://kodomotocamera.com " target="_blank">ぶどう</a></li><!--
--></ul><!--
--></div>
--><li><a href="http://kodomotocamera.com " target="_blank">いちご</a></li><!--
↑赤の太字部分はリンクしたいアドレスやタイトルを入れてくださいね。
⑧保存すると、完成～～！！
メニューバーが出来ました！！
頑張って設定してみてくださいね♪
応援してます＾＾*
ブログに来て頂いてありがとうございます！
応援Clickをぽちっとお願いします♪
↓ ↓ ↓
