くぜのメモ

メモのように色々なことを書いていく雑記ブログ

【はてなブログ】Google AdSense広告を入れると広告上部にハイフン(-)が入る事象の対応

Google AdSenseの広告を記事内に挿入した際、広告の上部に表示されてしまうハイフン(-)を非表示にする方法を紹介します。

今回対応する事象は、以下の画像のように広告自体は正常に挿入されているが上部にハイフンが表示されている状態を指します。

f:id:CXE:20220312194046p:plain

解決策

<!-- -->を<ins>タグの中に書き加わえ、<ins>タグを<div>タグで囲みます。

<ins>タグ内に何も書かれていないことと、はてなブログの仕様で<ins>タグのみだと<p>タグで囲まれることにより、ハイフンが勝手に挿入されてしまうのだと思われます。

なので、空のコメント「<!-- -->」を<ins>タグに記述し、<div>タグで囲んで<p>タグとして認識させないようにすることで、ハイフンを表示させずに広告を掲載できることを確認しました。

<div>
<ins class="adsbygoogle"
     style="display:block; text-align:center;"
     data-ad-layout="in-article"
     data-ad-format="fluid"
     data-ad-client="aa-bb-1234567890"
     data-ad-slot="1234567890"><!-- --></ins>
</div>