はてなブログカスタマイズ

はてなブログが『AMPアドセンス』対応!表示用コードはこれだ!

投稿日:

シェアする

スポンサーリンク

こんちゃす、たけ氏でっす

『AMP』話題ですよね
ですがはてなブログではAMPアドセンスに対応しておらず、うまみが少なかったので最近はあえてAMPを使用していない方が多くなってきたように感じます

 

そんなところにこんなブログ記事を見ました

[blc url="http://sore.konoblog.com/entry/amp"]

『うそだろ?どうせ表示されねーよwww』と思ったんですけど

 

マジで対応しとるやんけ

 

先ほどの記事ではAMPアドセンス用のコードは紹介されていなかったので、簡単にコードをまとめましたので以下からどうぞ~~!

※カスタマイズは自己責任でお願い致します、
不利益なことがおきても筆者は責任を負えません

 

AMPを導入する

はてなブログでのAMP導入方法は非常に簡単です

ダッシュボードの左メニューバーより【設定】→詳細設定→【AMP】

のチェックボタンに✔を入れてページ下部の【変更する】をクリック

以上です

 

 

以上です

ね、簡単でしょ?笑

 

ただ、この機能はプロ版オンリーですので、無料版の方は諦めて課金するかWordpressに移行しましょう!!笑

 

アドセンスコードにAMP用コードを追記する

AMPページは爆速で表示できるようになる代わりに非常にシンプルなデザインとなります

上記プラグインを使用している場合、初期デザインは

ヘッダー
記事
フッター

のような感じに。笑

なのでサイドバーなどに表示させているアドセンスは諦めて、記事内アドセンスのみ対応させます

 

通常、アドセンスを貼り付けるときはこのようなコードを使用しますよね

スポンサーリンクゥ!
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- アドセンスゥ! -->
<ins class="adsbygoogle"
style="display:inline-block;width:300px;height:250px"
data-ad-client="ca-pub-○○"
data-ad-slot="△▽"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

記事中アドセンスにもこういうコードを使っていると思います

赤字の部分は広告によって変わってくるので、普段使っているものを参考にしてください
このコードの下に↓のコードを追加します

<amp-ad width="300" height="250"
type="adsense"
data-ad-client="ca-pub-○○"
data-ad-slot="△▽">
</amp-ad>

赤字の部分は上のコードと同じに!
あとはフルコピペでOKです

このコードが『AMP用アドセンス』のコードです

 

『両方書いたら、広告2つ出るんじゃない?』と思った方!
(ぼくがそうでした)

 

安心してください、

『AMPページでは通常のアドセンスが表示されない』

『AMPアドセンスはAMPページ以外では表示されない』

ので、
2つ連ねて書くだけで両方対応できるのです!

 

これでAMP導入+AMPアドセンス対応は完了です!

 

おわりに

これまではWordpressの特権だったAMPアドセンスがついにはてなブログでも対応してしまいましたね…

ただ、AMPページをカスタマイズできるのはいまだWordpressの特権です!

デザインにこだわりたい方はぜひWordpressに引越しを!w

 

WordpessのAMP・AMPアドセンス対応、AMPページでのシェアボタン対応はこちらの記事をご参考にしてください

[blc url="http://30cm.xyz/ampad/"]

[blc url="http://30cm.xyz/ampshare/"]

 

そんな感じで以上!たけ氏でした!

 

【追記1】今までの記事に表示させてある記事中アドセンスについて

AMPアドセンスを表示するには、上に書いたとおり専用タグを書き加える必要があるので、
今まで記事中に直接アドセンスコードを記入していた場合、AMPアドセンスコードも直接書き加える必要があります

過去記事が100なら100回修正、1000なら1000回修正が必要…

ですが、AMPで表示されるページは『Googleトップニュース』や『はてなアプリ』から見た場合のみですので、全てを修正する必要もないのかな?と個人的には思います。

これから書く記事はAMPアドセンスコードを記述しておいて、ニュースでピックアップされそうな記事やはてなアプリからの流入が未だにある記事などのみ対応すれば良いかと!

気になる方は全部修正してもいいとは思いますが、その時間で新しい記事を書いたほうがはるかに生産的な気がします…w

この記事をシェアする!

おすすめ記事

1

こんちゃす、たけ氏でっす! 『メジャーな漫画はもう読んだ、次はちょっとマイナー漫画だ!』という方におすすめの、超面白い漫画を紹介します! マイナーの基準が難しいですけど メジャーでない なんか読んでる ...

2

こんちゃす、たけ氏でっす!   何度も繰り返して読んだり、本棚から引っ張り出して読み返しちゃう漫画ってありますよね! 今回はぼくが何度も読んだ漫画を紹介してみますっ ルールは 2回以上読み返 ...

3

こんちゃす、たけ氏でっす! 知り合いに必ず1人はいる『たけし』 かく言うぼくもたけしです そんなぼくがある日『アニメに出てくるたけしってどれだけ居るんだろう』と思い立ったのが地獄の始まり。まさかこんな ...

-はてなブログカスタマイズ

Copyright© 人生あと30cm! , 2024 AllRights Reserved Powered by AFFINGER4.