アメブロhtmlのアレな要素のリスト | WEB TANOSHII!!

アメブロhtmlのアレな要素のリスト

いいタイトルが浮かびませんでした。

人によっていらなかったりする要素のリスト。

人のブログをいじる機会があったのでついでにまとめてみます。


ルーム等へのリンク要素

ul.userNaviArea:ページ最上部の「ルーム|ブログ|フォト|相談|プレゼント」というリンク

それぞれにクラスが指定されていれば単独で消せるんですが。


ul.ameNaviArea:プロフィールの「ルーム|フォト|相談|プレゼント」というリンク

こっちはそれぞれに以下のクラスが指定されています。

・li.linkforroom:ルーム

・li.linkforphoto:フォト

・li.linkforrequestion:相談

・li.lastItem.linkforpresent:プレゼント


ついでにプロフィールの各要素のクラス

li.menuMsg:「メッセージを送る」

li#amemberProf3 li.menuAmember:「アメンバーになる」

menuPresent:「プレゼントを贈る」


ヘッダとフッタ

ul#amebaBar:ページ最上部のツールバー。

スクロール追従がうざいという方はpositionの値をstaticに書き換えてやると幸せになれるかもしれません。

多分これだけだと余白ができたりするので、marginあたりをいじる必要があるかも。

一応このブログの設定を載せておきます。


ul#amebaBar{
position:static;
margin-top:-23px;
padding:0;
}
* html body ul#amebaBar{
position:static;
padding:0;
margin:0;
}

多分これで動くと思います。たぶん。

「* html body ul#amebaBar」はIE6以下のみ適用されるはず。

このcssを適用しないとIE6以下ではツールバーが非表示になってしまいます。

ハックは極力使いたくないところですが、ハック無しに解決する方法を見つけるのが面倒だったので。

よい子の皆は真似しちゃだめですよ!


また、このul#amebaBarの中にある要素は以下の通りです。
・li.barSearch:検索バー
・li.barCheck:「チェックリストに追加」


div#footerArea:ページ最下部にあるフッタ。

非表示とかにするのではなく、いっそデザインとして割り切ってみてはいかがでしょうか。

とは言っても中身を編集できるわけではないので、margin:0 auto;とか追加してwidthを自身のブログのサイズに合わせたりするといいと思います。

ちなみにこのブログでの設定はこんなかんじになってます。


div#footerArea{
width:840px;
margin:0 auto;
padding:12px;
text-align:right;
background-color:#353535;
}

その他

a.menuMore:各エントリのフッタ部分にある「もっと」というリンク

a.petaLink:「ペタ」のリンク。いらないみたいな人は少ないと思いますが

おわり

間違いがあったら申し訳ありません。

ブログカスタマイズの手助けになれば幸いです。

広告の非表示はブラックかグレーか分からないのでノータッチです。


FirefoxのFirebugというアドオンを使えば各要素の構造を分かりやすく視覚化してくれるので、さらに詳しく知りたい方にはオススメです。

GoogleChromeのJSデバッガーでも代用出来ないことはないと思います。