● メニューを入れるだけなら簡単なんです
こんにちは。高橋好美です^^
お仕事でアメーバブログをしている方がやりたいと思っているカスタマイズ。
よく声が上がるのは「オリジナルヘッダー画像」と「メニュー」の作成です。
実は、メニューの作成だけなら簡単なんです。
「CSS編集スタッフのブログ」で説明が載っています。
やることは以下の2つだけです。
1:フリースペースに以下のタグを入れる
★となっている部分には、自分のアメーバIDを入れます。
このまま★にアメーバIDを入れると、
ブログ ナウ ペタ ピグ に飛ぶようになります。
2:CSSに以下の記述を追加する
こんな感じで2つしか作業はありません。
もちろん、細かい調整は必要ですが。
さて、入れるのは簡単なメニューバーですが、本当に考えるべきことはどこにあるのか。
メニューを考える以前のブログ全体の構造です。
何を目的に、何をメニューに載せるのかが本当は一番大事なんです。
カスタマイズさせていただく場合には、このブログの構成からお話しさせていただいています。
☆京都市西院、西京極、大宮、烏丸御池、伏見、国際会館、大阪枚方、兵庫、岡山などからお越しいただいております。
☆アメーバブログ初心者向けの講座・ヘッダー画像を作成するブログカスタマイズ講座。初心者にもわかりやすい内容で、自分のビジネスが魅力的に伝わるブログスキルが身に付きます。
こんにちは。高橋好美です^^
お仕事でアメーバブログをしている方がやりたいと思っているカスタマイズ。
よく声が上がるのは「オリジナルヘッダー画像」と「メニュー」の作成です。
実は、メニューの作成だけなら簡単なんです。
「CSS編集スタッフのブログ」で説明が載っています。
やることは以下の2つだけです。
1:フリースペースに以下のタグを入れる
<div id="myFreeArea"><a href="http://ameblo.jp/★/">BLOG</a><a href="http://now.ameba.jp/★/">NOW</a><a href="http://peta.ameba.jp/p/addPeta.do?targetAmebaId=★">PETA</a><a href="http://pigg.ameba.jp/?targetAmebaId=★">PIGG</a></div>
★となっている部分には、自分のアメーバIDを入れます。
このまま★にアメーバIDを入れると、
ブログ ナウ ペタ ピグ に飛ぶようになります。
2:CSSに以下の記述を追加する
/* ヘッダー下にメニューを設置する */
.skinContentsArea{
position:relative;
padding-top:48px;
}
#myFreeArea {
position:absolute;
top:0px;
left:0px;
height:46px;
width:980px;
overflow:hidden;
}
#myFreeArea a{
display:inline-block;
width:221px;
margin:2px;
padding:0 10px;
background: url(http://stat100.ameba.jp/common_style/img/skin/cmn/bg/transparent/transparent_fff_8.png);
border-radius:7px;
line-height:2em;
font-size:18px;
font-family: Tahoma;
font-weight: bold;
color:#333;
text-decoration:none;
}
#myFreeArea a:hover{
background : #b5daff ;
}
.skinContentsArea{
position:relative;
padding-top:48px;
}
#myFreeArea {
position:absolute;
top:0px;
left:0px;
height:46px;
width:980px;
overflow:hidden;
}
#myFreeArea a{
display:inline-block;
width:221px;
margin:2px;
padding:0 10px;
background: url(http://stat100.ameba.jp/common_style/img/skin/cmn/bg/transparent/transparent_fff_8.png);
border-radius:7px;
line-height:2em;
font-size:18px;
font-family: Tahoma;
font-weight: bold;
color:#333;
text-decoration:none;
}
#myFreeArea a:hover{
background : #b5daff ;
}
こんな感じで2つしか作業はありません。
もちろん、細かい調整は必要ですが。
さて、入れるのは簡単なメニューバーですが、本当に考えるべきことはどこにあるのか。
メニューを考える以前のブログ全体の構造です。
何を目的に、何をメニューに載せるのかが本当は一番大事なんです。
カスタマイズさせていただく場合には、このブログの構成からお話しさせていただいています。
阪急西院駅徒歩7分のアメブロカスタマイズ講座
貴女のためのパソコン教室:高橋好美
受付時間
9:30~17:30(月~金)
9:30~12:30(土)
京都市右京区西院西今田町10
080-8333-6539
・無料メルマガ/メール講座
・ヘッダーカスタマイズ依頼
・アメブロ講座案内
・教室アクセス
・お客様の声/ヘッダー作成事例
・お問い合わせフォーム
・電話予約 080-8333-6539
貴女のためのパソコン教室:高橋好美
受付時間
9:30~17:30(月~金)
9:30~12:30(土)
京都市右京区西院西今田町10
080-8333-6539
・無料メルマガ/メール講座
・ヘッダーカスタマイズ依頼
・アメブロ講座案内
・教室アクセス
・お客様の声/ヘッダー作成事例
・お問い合わせフォーム
・電話予約 080-8333-6539
☆京都市西院、西京極、大宮、烏丸御池、伏見、国際会館、大阪枚方、兵庫、岡山などからお越しいただいております。
☆アメーバブログ初心者向けの講座・ヘッダー画像を作成するブログカスタマイズ講座。初心者にもわかりやすい内容で、自分のビジネスが魅力的に伝わるブログスキルが身に付きます。