Seesaaブログの広告を消したスマホ版画面

Seesaaブログの広告を非表示にするという投稿が複数にまたがってしまいました。ボクの中では Seesaa ブログの広告を消すことは、スマートフォン版を無効にする試みの副産物のようなものです。

従いまして、Seesaa ブログの広告を消す、特にスマートフォン版の広告を消すことを目的としている訪問者の方々には、いささかわかり難いことになっていたと思います。

2014年5月現在で Seesaa 広告は100%、ひとつ残らず非表示にすることができています。そこで、Seesaa 広告を消すというトピックのみに絞り込んで、完結編としてまとめたいと思います。

Sponsored Link

広告を消すのは規約上どうなのかという問題とイタチごっこが避けられないので、このブログでボクはスマホ版を強制的に PC 版へ飛ばすカスタマイズをおススメしています。

広告を非表示にするのであれば実際にカスタマイズしたサンプルブログがありますから、文末のリンクにあるサンプルブログで結果を確認してください。

Seesaaブログの設定編

広告表示に関する設定を簡単にまとめます。

  1. 「設定」>「詳細設定」>「ブログ設定」
    • 共通ヘッダー:表示しない

  2. 「設定」>「詳細設定」>「記事設定」
    • 広告の表示:無効

  3. 「設定」>「詳細設定」>「記事設定」
    • 記事下広告の表示:広告を表示しない(*1)
    • 60日間更新がない場合:広告を表示しない
    • 検索経由の広告表示:広告を表示しない

*1: 個人的な勘違いかもしれませんが、記事下広告の設定は定期的に「表示する」ように変更されているような気がします。

広い意味でいえば、例えば「ブログ設定」の「画像詳細ページを有効」にしていると、アップロードした画像が表示される別窓に広告が表示されます。しかし、今回は1クリックして誘導されるページの広告表示については除外して考えます。

PC のデザインコンテンツ編

Seesaa ブログを開設した直後の PC 版コンテンツには、サイドバー広告が配置されています。

「デザイン」 > 「PC」 > 「コンテンツ」と進み、ピンク色のコンテンツをゴミ箱に捨てます。

デザイン CSS (カスケードスタイルシート)編

デザインで変更するのは PC版 CSS とスマホ版 CSS の両方です。スマホ対応がメインですが管理が煩雑になるのでデスクトップ対応も含めて1本にしています。同じものを PC 版とスマホ版の CSS にそれぞれ追記します。

  1. 「デザイン」>「PC」 >「デザイン設定」
    • 適用している CSS を選択

  2. 「デザイン」>「スマートフォン」>「デザイン一覧」
    • 適用している CSS を選択

/* 広告非表示 */
[id*="adArea"]{visibility: hidden; height: 0;}
[class*="ad-area"]{display:none;visibility:hidden;height:0px !important;}
/* 独自広告表示優先のために free-area は除外。文末追記参照。
[class*="free-area"]{display:none;visibility:hidden;height:0px !important;}
*/

[id*="jt:seesaa_seesaa"]{display: none; visibility: hidden; height: 0;}
[class*="adlantis"]{visibility: hidden;}
[id*="adblock"]{display: none; visibility: hidden; height: 0;}
[class*="seesaaAdA"]{display: none; visibility: hidden; height: 0;}
.seesaa-adLink, .adlink, .adBoth, .adText, .adUrl, .adImage, .adSponsor, .adSponsorUrl, .adHr{visibility: hidden; height: 0; width: 0;}
[class*="ad_frame"]{display: none; visibility: hidden; height: 0;}
[class*="adlantis_sticky_zone"]{display: none;}
[id*="androidGame"]{display: none; visibility: hidden; height: 0;}
[class*="ichioshi"]{display: none; visibility: hidden; height: 0;}
[class*="top-ad"]{display: none; visibility: hidden; height: 0;}
[class*="im_ad"]{display: none; visibility: hidden; height: 0;}
[class*="androidgame"]{display: none; visibility: hidden; height: 0;}
[id*="iphonead"]{display: none; visibility: hidden; height: 0;}
[id*="iphoneFooterAd"]{display: none!important; visibility: hidden!important; height: 0!important;}
[id*="androidFooterAd"]{display: none!important; visibility: hidden!important; height: 0!important;}
[id*="adstir_ad"]{display: none; visibility: hidden; height: 0;}
[class*="seesaa-adBox"]{display: none; visibility: hidden; height: 0;}
[class*="adBox"]{display: none; visibility: hidden; height: 0;}
[class*="adTitle"]{display: none; visibility: hidden; height: 0;}
[id*="adcon"]{display: none; visibility: hidden; height: 0;}
[id*="imobile_adspotdiv"]{display: none; visibility: hidden; height: 0;}
[id*="nend_adspace"]{display: none!important; visibility: hidden!important; height:0!important;}
#iphone-link{display: none!important;}

2015年1月現在の最新版は Seesaa 広告を消してペナルティが発動した報告記事に記載されています。

ボクが唯一非表示にできなかった、スマートフォンでデスクトップ版のページを閲覧したときに表示されるフローティング広告が、赤文字で表示されている nend_adspace です。単に定義上の問題だったようで、display, visibility, height すべてに important を追記することで消すことができました。

このフローティング広告は、クッキーではなく User Agent で制御されていて、クッキーの切り替えに専念するあまり見落としてしまいました。お騒がせしました。

念のために HTML 編

PC 版の HTML を少しだけいじります。

  1. 「デザイン」>「PC」 >「HTML」
    • 適用している HTML を選択

1. body タグのすぐ下(あたり)にある ad_plugin.js
<script src="<% site_info.blog_url %>/contents/js/ad_plugin.js"></script>

これを以下のようにコメントアウトします。
<!--
<script src="<% site_info.blog_url %>/contents/js/ad_plugin.js"></script>
-->

2. タグで検索してヒットするユーザタグの usertag_ad
<% if:blog.has_usertag_ad -%><div class="tag-body">
<% blog.usertag_ad_html(tag, css, 2) %>
</div><% /if %>

この3行を以下のようにコメントアウトします。
<!--
<% if:blog.has_usertag_ad -%><div class="tag-body">
<% blog.usertag_ad_html(tag, css, 2) %>
</div><% /if %>
-->

この HTML の修正は「おなじない」みたいなものです。先ほど、広告の設定で記事下広告が「表示する」に変更されているのではないかと書きましたが、基本設定が変わっても CSS と HTML でシャットアウトできることがあります。多少、タブり感はあっても構わないと思っています。

このHTML のカスタマイズに関して、7,8年の Seesaa ブログの運用経験では記事や検索結果ページ、タブページなどで広告が表示されたことはないので、これで宜しいのかと。

ここまでのカスタマイズの結果は、「ブログの広告を消すサンプルブログ」で確認してみてください。デスクトップ版のテンプレートは、「超シンブル(両サイドバー)」、スマートフォン版は「Basic」を適用しています。正確な検証結果を得るために、広告を消す手順以外のカスタマイズはしていません。

デスクトップからスマートフォン版を確認するときは、ブラウザにユーザーエージェントを切り替えるアドオンが必要です(Google Chrome なら UserAgent Switcher など、FireFox なら User Agent Switcher など)。

[サンプルブログ]

Seesaa 仕様変更は CSS の外部化で対応

実はこうやっている間にも Seesaa ブログ側の仕様は変わっているようです。5月27日には制御できそうにない広告が新たにスマホの Basic テンプレートに追加されていました。28日現在はコードを見ても消えて無くなっているようですが、改良して近日中に追加されるのかもしれません。

仕様が変更になったときに、管理している Seesaaブログが1つや2つなら手直しは楽ですが、10、20、50、100となると、全部修正する手間がかかってしかたありません。

そこで、今後のメンテナンスを見越して、広告非表示の CSS は外部化しメインの CSS にインクルードしておいたほうが良いかもしれません。最初に1回だけ CSS を編集すれば、仕様変更があっても外部化した広告非表示 CSS を編集して再アップロードで対応できます。仕様変更だけではなく、今後、規約の変更があって広告非表示カスタマイズは不可となったときでも、外部 CSS を空にすれば対応完了です。

実際、ボクは先に紹介したサンプルブログに広告非表示 CSS をアップロードし外部化して、管理している Seesaa ブログの CSS にインクルードしました。このブログもそのようにしました。

CSS へのインクルードの表記例
@import url("http://www.example.com/css/nodisplay.css");

最後に

無料ブログサービスプロバイダの主な収益源は広告です。その広告を消してしまうことが今後どのような扱いになるかは分りません。普通に考えればアウトではないかと。以前も書きましたが、一連の広告を消す投稿記事は広告を消すことを推奨しているものではありません。カスタマイズにより不利益が生じたとしても、ボクは一切の責任を負いませんので予めご了承ください。

また、このブログの CSS を見て広告非表示の外部 CSSを使ってもらっても構いませんが、メンテナンスはお約束できかねます。

と言っておきながらナンですが、ボクが CSS をアップロードした Seesaa ブログが削除されたら終わりですから、CSS 用の Seesaa ブログを別アカウントで作って、同じような体系を独自に構築したほうが良いですね。ちなみに、ボクの運営している Seesaa の とある秘密ブログは FC2 無料ホームページにアップした CSS をインクルードしています。

それでは以上で、Seesaa ブログの広告を消す話題については打ち止めの予定ですが、ひとつお願いがあります。
ボクは Android ユーザで検証はすべて仮想環境です。 iPhone の実機で検証したのは地元 au のデモ機 iPhone5 で数回。もし、広告が見えてるぞというときには、是非コメントで教えてください。

さらに最後に

今のところ無料ブログサービスプロバイダは、PC 版とスマホ版のテンプレートを提供しています。時代はデスクトップからモバイルデバイスへ流れていますから、広告収入をスマホ版テンプレート側に重きをおく流れなのかと。そしてボクたちは否応なしに広告だらけのテンプレートを使うことになる。

今回はそのスマホ版での広告を消してしまえという試みですが、これはイタチごっこです。広告を消すために常にスマホテンプレートを監視していなくてはならなくなり、時間も労力も無駄です。

ボクはスマホ版テンプレートは捨ててしまい、カスタマイズは PC 版のテンプレート1本に絞る。スマホ版に使っている時間と労力をレスポンシブ化に注ぐべきだと考えています。そのために、どうすればスマホ版へのアクセスを PC 版に流せるかに注力しているのであります。

恐らく後1,2年は無料ブログサービスプロバイダはスマホ版の開発に突き進み、PC 版のレスポンシブ化が後から着いてくることになると思われます。PC 版レスポンシブが追いついて来て初めて、モバイルデバイスからの PC 版アクセスに対して、もっと広告を出さねばという流れになるのかと。

そうなる前にスマホ版には見切りをつけて、PC 版カスタマイズ、特にレスポンシブ化のノウハウを貯めておく必要があるとボクは思います。

なんてことを言ってますが、本心では早いところ Seesaa.net という無料ブログのブランドを捨てて、レンタルサーバ + 独自ドメイン + Wordpress に行った方がよいと思ってます。こんなに一所懸命になって広告を消したりする必要もなし、テーマ (テンプレート) は最初からレスポンシブだし。時間と労力と、そして SEO 効果を考えると、すぐにでも独自ドメインを取得して、とりあえずは今の Seesaa に独自ドメインを割り当て、1年くらい掛けて独自ドメインの Google ページランクを 2 くらいに上げておき、ページランク 2 の独自ドメインごとレンタルサーバに引っ越すと。

ボクの とある秘密ブログは今、この計画が進行中です。


※追記:2014年5月30日
独自広告が表示できないというご指摘を頂き、free-area のスタイルを除外し、独自広告表示に対応しました。これにより、free-area 領域への Seesaa 広告が表示される可能性もあります。確か1つあったような記憶があります。

[サンプルブログ]

Sponsored Link

この記事へのコメント

0件
コメントをどうぞ
お名前:[必須入力]

メールアドレス:

ホームページアドレス:

コメント:[必須入力]

Sponsored Link