人気ブログランキングの応援
をして頂けると励みになります。
以前からルームにヘッダー画像とメニューを設置
してみたかったのですが、
なぜか難しそうだなあと思い、
気になりながら避けていました。
しかし、今回いろいろ調べてみると、
これならできそうだなあと思い、
取り組んでみることにしました。
まず、ヘッダー画像は、これまで使っていたものを
そのまま使用したいと思います。
次に、ヘッダーメニューの画像は、
GIMPで次のように作成しました。





[プロフィール]→[プロフィールの編集]→[フリースペース]の順にクリックし、
HTML入力画面が表示されたら、
まず、次のHTMLを入力し、保存しました。
<div id="roomtop"><img src="http://stat.blogskin.ameba.jp/blogskin_images/20110516/13/2b/d2/g/o09500300kiyo-customize1305521105328.gif"><a
href="http://ameblo.jp/kiyo-customize/" title="ここをクリックするとトップページへ移動します。"><img
src="http://stat.ameba.jp/user_images/20110627/10/kiyo-customize/d5/35/g/o0190005011315473430.gif"></a><a
target="_blank" href="http://ameblo.jp/kiyo-customize/entry-10802605638.html"
title="カスタマイズについて詳しく書かれた本をご紹介します。"><img src="http://stat.ameba.jp/user_images/20110627/10/kiyo-customize/26/2e/g/o0190005011315477363.gif"></a><a
target="_blank" href="http://blog.ameba.jp/reader.do?bnm=kiyo-customize"
title="ここをクリックして、読者登録をしてくださいね。"><img src="http://stat.ameba.jp/user_images/20110627/10/kiyo-customize/f6/be/g/o0190005011315478870.gif"></a><a
target="_blank" href="http://ameblo.jp/kiyo-customize/entry-10906531355.html"
title="カスタマイズして欲しい方は、こちらです。"><img src="http://stat.ameba.jp/user_images/20110627/10/kiyo-customize/0c/cd/g/o0190005011315482093.gif"></a><a
target="_blank" href="http://runanet.jp/page5.html"
title="ご質問等何でもこちらでお問合せくださいね。"><img src="http://stat.ameba.jp/user_images/20110627/10/kiyo-customize/81/e5/g/o0190005011315484346.gif"></a></div>
次に、忘れないように下記のHTMLの入力も必要です。
入力場所は上記のフリースペースと同じで、続きに入力しました。
<style type="text/css">#wideContentsArea{width:950px;/*全体の横幅*/margin:0
auto;position:relative;}#header{visibility: hidden;height:400px;/*画像の高さ*/}#roomtop{width:950px;position:absolute;top:0px;/*上からの位置*/left:0px;/*左からの位置*/}</style>
なお、上記のHTMLは、私のブログの場合の仕様ですので、
ご注意ください。
出来上がったマイルームは、こちらです。
↓↓↓
http://profile.ameba.jp/kiyo-customize/
なお、今回参考にさせて戴いたブログはこちらです。
ありがとうございました。
↓↓↓
アメブロルームカスタマイズ ボタンの設置方法
今回は、以上です。
最後まで読んでいただき、
ありがとうございました。
少しでもお役に立ちましたら、
応援お願いします!!