mixiの新デザインをhackしてみる 2008年夏版

mixiの新デザインをhackして台無しにしちゃおう！

SNS「mixi」のデザインが7月7日にリニューアルされました。
前回ほどの強烈な変化はありませんが、ボタンがデカくなったり、検索窓の位置が変わったりとアチコチ変化しております。

このままだと使いづらいので、FirefoxのユーザーCSS機能を使って、サクッとイカすデザインにしちゃいましょう。

mixiを使いやすくするための３ステップ

1. 以下のコードをuserContent.cssって名前で保存

userContent.css

@-moz-document domain(mixi.jp){
*{
line-height: 1.5em !important;
}
body{
background-color: #FBFBFB !important;
}
#adBanner,.adBanner,#pagetop,.headerNavigationRight,#footprintjack,#footprintjack02,#prSepecial,.bottomSpaceAd,.prContents{
display: none !important;
}
.review,.music{
display: none !important;
}
.headerSearch,.headerNavigationBottom{
float:left;
text-align:left;
}
.globalNavigation01{
padding-left:20px !important;
}
.personalNavigation01{
clear:both;
}
#mixiNewsArea,#musicTeaserBannerArea,#keywordRanking{
display: none !important;
}
dl.contentsList01 dd,dl.contentsList02 dd p.moreLink01{
padding-bottom:1px !important;
}
div.newListBox01 h4,div.newListBox02 h4{
padding:1px 10px 1px !important;
}
}

2. 保存したファイルを以下のフォルダに移動
   元からファイルがある場合は、元ファイルをメモ帳で開いてコードを追記する

vista
C:\Users\*****\Application Data\Roaming\Mozilla\Firefox\Profiles\*****\chrome
xp
C:\Documents and Settings\*****\Application Data\Mozilla\Firefox\Profiles\********\chrome
(*****には任意の文字が入ります)

3. Firefoxを再起動

解説：このcssでやってること

• 広告を削除
• mixiの上部ロゴを削除
• 検索窓とナビゲーションを左へ移動
• 上部のボタン群から「レビュー」、「ミュージック」のボタンを除去
• 間の抜けた行間を詰める
• 右側のコンテンツをカレンダー以外全て削除
  • 全部消そうかとも思ったけどカレンダーは意外に便利なので・・・・