2012年11月12日

Chrome: Stylebotで特定サイトの特定の広告を非表示にする

楽天ウェブ検索の検索結果画面では、スポンサーリンク(広告)欄が
・非常に長くなり、本来の検索結果がスクロールしないと見えないことが多々ある。
・背景の色が薄いので、画面の状況によっては、どこまでがスポンサーリンクなのか判別できない時がある。
といのうが気になっていました。


楽天ウェブ検索 スポンサーリンク.png

Chromeで他のサイトの広告も合わせてバッサリ消してしまうなら
Adblock Plus 拡張
を入れてしまうのが早いのですが、

他のサイトの広告は研究のために表示しておきたいということもあるので、
「このサイトのこの広告だけ消す」
ということができないか調べてみました。

この様な場合、 Stylebot が良いかもしれません。

まず、 Stylebot を[Chromeに追加]でインストールします。


stylebot-1.png

インストール後、表示の変更をしたいページをChromeで表示させます(今回は楽天検索の検索結果画面)。
Chromeのアドレスバーの右端に表示されている[css]をクリックすると、
stylebotの設定画面が表示されます。


stylebot-2.png

この状態で、表示を消したいエリアにマウスオーバーすると、緑色の枠が表示されます。
マウスを動かすと、選択領域が変化していきますので、
消したい領域になるようにマスを動かします。
緑色の枠が、望みの領域になったところで、左クリックします。
stylebot設定画面の[Select an elemt]に、選択したDiv名などがセットされ、
緑の枠が動かなくなります。

緑色の枠が表示されなかったり、領域を再設定したい場合は、[Select an elemt]欄の左にある stylebot click to disable selection of elementボタン.png click to disable selection of elementボタン をクリックしてください。


stylebot-3.png

次に、stylebot設定画面の下の方、見えない場合は下にスクロールすると
[Layout & Visibility]セクションがあり、その一番上の[Visibility:] という項目の [Hide]ボタンをクリックします。
選択していた領域が非表示になります。

一番下の方にある[Edit css]ボタンをクリックします。


stylebot-4.png

画面が、Edit the CSS for ”対象サイト名” に切り替わります。
ここまでで設定した内容がcssで表示されます。
ここで、css表記レベルで調整することもでき、表示をもとに戻したい場合、ここの記述を削除しればもとに戻せます。

div.sponcerMainBackgroundBpattern.sponcerMainClass_leftnavi {
display: none;
}


下の方にある、[Save]ボタンを押して、設定内容を保存します。
[Save]ボタンを押さないと、新しいタブなどで設定した内容が反映されません。



↓参考になるブログがたくさんあります!ぜひどうぞ!↓
にほんブログ村 PC家電ブログ パソコンの豆知識へ    にほんブログ村でこのブログのランキングを確認する

posted by ken at 15:16 | Comment(0) | ネット・PC | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
※ブログオーナーが承認したコメントのみ表示されます。
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。