📝

【悪用厳禁】無料版はてなブログの広告を消す方法【はてなブログ】

今回は無料版はてなブログで広告を消す(非表示にする)方法を紹介します。 正式にははてなブログは有料版にしないと広告は消せませんが、その気になれば簡単に消すことができます。 ちなみに検証には実際のブログのコードを変えたのではなく、Chromeのデベロッパーツールを使いました。

🙅 Caution!
  • 各自の責任で行ってください。当ブログは一切責任をとりません。(要するにおすすめしません。)

広告が貼られている仕組みを調べてみる

まずは広告が貼られている仕組みを調べます。今回はChromeのデベロッパーツールを使いました。

記事上(スマホ版)

<div class="ad ad-online-afc"></div>

記事上の広告はスマホ版でしか表示されません。

記事下

<div class="imageholder"></div>

記事下にはimageholderというクラス名がついているようです。

記事下(スマホ版)

<div class="ad entry-footer-ad google-afc-image test-google-rectangle-ads"></div>

スマホ版の記事下にはad entry-footer-ad google-afc-image test-google-rectangle-adsというクラス名がついているようです。パソコン版と比べるとかなり長いですね。

プロフィール下(スマホ版)

<div class="ad"></div>

プロフィール下の広告はdiv要素のadクラスでまとめられているので、これを非表示にしたらまるごと消すことができました。

サイドバー(スマホ版)

<div id="footer-ad-rectangle" class="ad center footer-ad section"></div>

サイドバーの広告にはidclassがついていました。

広告を消すコード

先程調べたidclassを使い、広告を消していきます。

.ad ad-online-afc,.imageholder,.ad entry-footer-ad google-afc-image test-google-rectangle-ads,.ad,.ad center footer-ad section,#footer-ad-rectangle {
	display : none !important;
}

これだけで無料版でもはてなブログの広告は非表示にすることができます。 しかし最悪アカウント停止などもあり得るので、あまりおすすめはしません。

WEBデザインブログ「Koblog」の管理人。現役高校生。趣味は音楽鑑賞とネットサーフィン・読書。主にWEBデザイン・プログラミング・GatsbyJS・はてなブログ関連のことについて発信していきます。投げ銭をしてくれる方を募集しています。

donation