※注意※
下記に書かれた方法で
メニューバーを変更すると
みんカラ利用規約違反になります。
すでに何人も警告が来ていますので
（私含む）
実行する際は自己責任で
お願いいたします
こんばんは（*^o^）ノ
病み上がりで会社に行ったら、
いきなり体調を崩したプレ之進です
（つд｀）
あなどれねぇな～、インフルエンザ…orz
さて、昨日のブログに書いたメニューバーを
既存のブルーの帯から任意のボタンに変更する方法ですが…
一応、書いておこうかと思います。
（なにか問題があっても私には対応できないので、自己責任で）
※IE以外では変更されないそうなので要注意。
基本的にある程度スタイルシートを弄ったことがある方向けに
書いていきます。まったく弄ったことがない方は…
このサイト→ABI☆さんの『みんカラのスタイルシート変更方法』
が詳しく書いてあるので目を通してみてください♪
******************************************************************
1.変更するボタンを作ります
既存のブルーのメニューバーは画面の端から端までありますが
ボタン自体は、930px×27pxの画像（93px×27pxのボタンが10個並んでいる）なので
このようなボタンを、93px×25pxで10個作成します。
ボタンを自動生成してくれるサイトはいっぱいありますが、
私はココを使いました♪ コチラもおすすめ!!
★「ピクセル」という意味の単位を
「px」とすべきところを「pt」と誤表記してました。訂正いたします。
申し訳ありません…orz
2.それらを「ペイント」などを使って連結させて、930×25のバーを作ります
（この画像はサイズを縮小しています）
3.それをスタイルシート用画像に登録します
4.スタイルシートの一番上のほうに、'body'と頭に書かれた文字列があります。
その後ろに以下の文字列を挿入します
body #UserHeader #gNav
{
filter: alpha(opacity=0);
-moz-opacity: 0.0;
opacity: 0.0;
}
#UserHeader
{
background-image: url('先程スタイルシート用画像に保存したＵＲＬ');
background-repeat: no-repeat;
background-position: center bottom;
background-color: transparent;
}
※とらんちょさんのアドバイスによりfirefoxでも見られるように変更
5.上の画面の赤線部分’から’の間に保存したメニューバーの画像URLを貼りつければOKです。
6.プレビューで見てみて自分の作ったメニューバーに変更できていれば「保存」して完成です。
うまくいかなければ「保存」さえしてしまわなければ何度でもやり直せますので
思う存分いじり倒してくださいね（笑）
※この方法でメニューバーを変えると、
ブログなどサイト全体の背景がメニューバーの上の部分
（ようこそ○○さんとか書いてある段）
にも適用されるので、ページ全体に統一感も出て一石二鳥です
自分がよくわかってないので、
下手くそな説明にになってしまいましたが
皆さんのスタイルシート弄りの参考になれば幸いです…
何か間違っていたらやさしくご指摘をお願いしますｍ(_ _;)ｍ
ブログ一覧 |
スタイルシート | 日記
Posted at
2009/01/27 00:01:34
メニューバーを変更する件…
※注意※
