digital 千里眼 @abp_jp

アナログな日常とデジタルの接点

Adblock Plus で「テキスト広告」を消す方法

テキスト広告の例(YouTube で F1 2010 Australia と検索して出てきた広告)



なぜテキスト広告を消すのは面倒なのか

Adblock Plus でバナー広告を消すのは比較的簡単。広告画像の URL を Adblock Plus に追加登録すればいい。でも、テキスト広告だとそうはいきません。HTML とテキスト広告が混在しているからです
Adblock Plus では、テキスト広告と HTML が混在している場合でも、方法を分けて広告を消すことができます

テキスト広告を HTML 内に混在させる2つの方法
  1. JavaScript でテキスト広告を作成(例:http://pagead2.googlesyndication.com/pagead/show_ads.js
  2. 最初から広告を混在させた HTML を作成(多くの場合、サーバー側のプログラムで作成) 今回はこちらがメイン

どちらの方法を使っているのか判別する方法

    • JavaScript を Off にして同じページを見てテキスト広告に変化があるか
    • 広告表示用の JavaScript があるか(HTML をソース表示し「.js」等で検索)
JavaScript によるテキスト広告を消す

前者の対処法はバナー広告を消すときと対処法は同じです。テキスト広告用のスクリプトを特定し、それを Adblock Plus 追加登録すればいい
例えば、http://pagead2.googlesyndication.com/pagead/show_ads.js なら「/show_ads.js」とか「/pagead/show_ads.」とか「||googlesyndication.com^$third-party」とか書き方はいろいろありますが、誤作動しないように特徴を捉えていればいいわけです(記法の解説? Adblock Plus 1.1 で非表示要素の簡易記法が非推奨に変更された件とその他更新内容 - digital 千里眼 @abp_jp

最初から広告を混在させた HTML のテキスト広告を消す

非表示要素(Element Hiding)というやり方を使います。CSSスタイルシート)の知識、特にセレクタ(Selector)を理解している必要があります

セレクタについては以下を参照

Firefox なら、ID や Class 調査に「DOM Inspector」と右クリックから呼び出すツール「InspectThis」を利用すると便利。Google Chrome なら Firebug 似のツールが最初から含まれる(JavaScript有効時のみ機能する)

作業の流れ

    1. テキスト広告上で右クリック ⇒ 「要素を検証」
    2. テキスト広告を囲んでいる HTML タグ(多くは div)を特定
    3. 上記 HTML タグを特定するセレクタを作成
    4. Adblock Plus の非表示要素に書式を合わせて先頭に「##」を加え追加登録

例1

    1. セレクタは ID を利用して「#search-pva」となる
    2. これをベースに Adblock Plus 用にドメイン制限(youtube.com)を加えると...
    3. youtube.com###search-pva」ができあがり
    4. これを Adblock Plus に追加登録


例2

    1. 消したい div には class はあるけど ID がない... 親要素を辿ると ID 発見
    2. セレクタは「#result-main-content > div.searchView」を使う
    3. これをベースに Adblock Plus 用にドメイン制限(youtube.com)を加えると...
    4. youtube.com###result-main-content > div.searchView」で完成
    5. これを Adblock Plus に追加登録

広告ブロックの結果

Adblock Plus 日本語版フィルタ作成メンバー募集中!