Game Sparkを”普通に”する

以前、4gamerやらnegitakuやらのuser CSSを紹介した記事が某有名ゲームサイトのトップにリンクされてPVが伸びたので今日はその続きのお話です。



みなさんはGame Sparkをご存知でしょうか。国内の海外ゲームニュースサイトの中では最大手なので、毎日チェックしている人も多いでしょう。僕もその一人です。
日頃お世話になっているGame Sparkですが、1つだけ気になる所があります。なぜか、記事が全て左揃えなのです。おそらく、記事全体を左寄せすることで、右側にある（相対的に中央寄りな）広告を目立たせる目的が有るのでしょうが、コンテンツを中央に配置するのが普通のウェブ界で、完全左揃えは違和感バリバリです。なんか気持ちが悪い。なので、CSSを工夫して中央に配置される様にしてみました。

body table:first-child {

margin-left : auto ; 

margin-right : auto ;

}

これが僕が書いたCSSです。Operaをお使いの方は、上記のスタイルシートをテキストファイルの.cssで保存してしてください。そして、Game Sparkを表示した上でF12 ->Edit Site Preferences ->Displayタブ ->My Style sheetで保存したファイルを指定すると動くと思います。

Firefoxは普段使わないのでよくわからないですが、スタイルシートはこのようになるのかな？

@-moz-document url-prefix(http://gs.inside-games.jp/){

body table:first-child {

margin-left : auto; 

margin-right : auto ;

}

}

動くかどうか試してないのであれですが、こことか見たらいいと思います。 chromeは・・・しりません。

ところでこのスタイルシートはGame Sparkのトップページでなぜか期待したとおりに動きません:(
javascriptをオフにすると動いたので、そこらへんが関係しそうですが、調べるのが面倒くさいので気になる人は各自調べてください。
それから各記事のコメントページも動きません。どうせ気持ち悪い人たちが宗教戦争しているだけなので僕はどうでもいいですが。

最後に。僕は素人なので、なにか欠陥があるかもしれません。自己責任でおねげーします。


以下雑記。

blogとかのテンプレートをいじったことのある方ならソースを見れば分かると思いますが、Game Sparkはなぜかタグに直接スタイルが書かれていて、ユーザーCSSを弄りにくい仕様になってました。しょうがないので今回はタグの親子関係を利用してセレクタを指定しています。僕の被害妄想ですが、なにか悪意を感じました。

4gamer.netってハードレビューとコラムしか読む価値ないのに、ごちゃごちゃしすぎじゃね？

ゲームが好きな人はwww.4gamer.netをよく見ると思いますが、4gamerってなんかごちゃごちゃしてますよね。全画面の広告がうざかったり、サイドバーに情報がたくさんありすぎて、かえって邪魔だったり。

昔は数百MBあるゲームのデモを高速にダウンロードできる国内ミラーとして重宝してましたが、今の4gamerはなんか色々とアレな記事ばかりで・・・・残念の一言。そんな4gamerをちょっとでも改善できないかなーと思ってユーザCSSをつかってちょっとした工夫をして見ました。

これがオリジナル

ユーザCSS適用

だいぶ、すっきりしました。これでしょーもない提灯記事やらMMOやらを排除できました。でも不自然に広告が残ってかえって気になる・・・。proxomitronをつかってゴニョゴニョしてみました。

ゴニョゴニョ・・・

これで必要そうな情報だけになりました。めでたし、めでたし。まあ、最初からproxomitron使えって話かもしれませんが。

これがユーザCSSの中身です。OperaだとF12 ->Edit site preferences ->Display ->My stlye sheetで簡単にサイトごとに指定できますし、他の現代的なブラウザでも指定できるらしいです。

body{
background-image: none !important;
} 
.header{
background-image: none !important;
}
.right_contents {
visibility: hidden !important;
}
.left_contents {
visibility: hidden !important;
}
.whats_new{
visibility: hidden !important;
}
.footer_index{
visibility: hidden !important;
}

ついでにnegitaku.orgもシンプルにして見ました。

 鬱陶しいsteel sensei押しが消えました。「そのマウスで勝てるのか？」じゃねーよ！大きなお世話だ！

body{
background-image: none !important;
} 
#takeover {
background-image: none !important;
}
.module{
visibility : hidden !important;
}
.comments-open-header {
visibility : hidden !important;
}
.comment-open-content{
visibility : hidden !important;
}
.trackbacks {
visibility : hidden !important;
}
#recent-news {
visibility : hidden !important;
}

 4gamerやnegitakuがサイトデザインを変えない限り画像を差し替えようが、うまく動くでしょう。よかったよかった。