Googleアドセンス広告をページの中央に配置する方法｜HTMLタグで位置指定

Googleアドセンス（ AdSense）広告がページの左端に表示されて、位置を変更したくても変わらずに困ってるという人はいませんか？

このブログもGoogleアドセンスを利用していますが、アドセンス開始時に、見よう見まねでCSSで位置を動かそうとしても、うんともすんとも言わない状態が続いてた時期がありました。

「CSSでも全然問題なく動かせるよ」

そんな問題のない環境の人も多いとは思いますが、<img>タグのある画像や写真、他のアフェリエイト広告を操作するようにCSSでは上手くいかず困ってる人もいるでしょう。

<table>タグを使用する等、Googleアドセンス広告の表示位置を変更する方法は幾つかあるとは思いますが、単純にGoogleアドセンス（ AdSense）広告をページの中央に表示するだけなら

HTML タグの <div align=”center”> と </div> でGoogleアドセンス広告コードを囲む

これだけでOK。

▼Googleアドセンスで作成した300 x 250 のディスプレイ広告のコードを貼り付け。
ページの左端に表示されます。

INDEX

Googleアドセンス（ AdSense）広告の位置をHTML タグで中央に配置する
Googleアドセンス（ AdSense）広告の位置をHTML タグで右端に配置する
まとめ

Googleアドセンス（ AdSense）広告の位置をHTML タグで中央に配置する

Googleアドセンス（ AdSense）広告をページの中央に配置する場合は

<div align=”center”>　</div>

で、広告のHTMLコードを囲みます。

300 x 250 のディスプレイ広告をページの中央に配置する場合は、作成した広告のHTMLコードを

[<div align=”center”>　</div>]で囲みます。

※下記例の広告HTMLコードはダミーです。

<body> 
<div align="center">
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>
<!--Google AdSense 300_250 -->
<ins class="adsbygoogle"
style="display:inline-block;width:300px;height:250px"
data-ad-client="ca-pub-1234567890123456"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</body>

▼Googleアドセンス広告のコードを[<div align=”center”>　</div>]で囲んで貼り付け。
ページの中央に表示されました。

Googleアドセンス（ AdSense）広告の位置をHTML タグで右端に配置する

Googleアドセンス（ AdSense）広告をページの右端に配置する場合は

<div align=”right”>　</div>

で、広告のHTMLコードを囲みます。

300 x 250 のディスプレイ広告のHTMLコードを[<div align=”right”>　</div>]で囲みました。
※下記例の広告HTMLコードはダミーです。

<body> 
<div align="right">
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>
<!--Google AdSense 300_250 -->
<ins class="adsbygoogle"
style="display:inline-block;width:300px;height:250px"
data-ad-client="ca-pub-1234567890123456"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</body>

▼Googleアドセンス広告のコードを[<div align=”right”>　</div>]で囲んで貼り付け。
ページの右端に表示されました。

自立学習型の「テックジム」は非エンジニアにオススメする定額制プログラミングスクール

プログラミングが出来るようになりたいでもエンジニアになりたいわけじゃない 2020年から小学生のプログラミング科目の必須化が始まり、続けて中学・高校でも必須化、そして、大学入試にプログラミング科目が追加されます。プログラミングに興味を持つ...

まとめ

Googleアドセンス（ AdSense）広告の位置をHTML タグでページの中央又は右端に移動する方法を紹介しました。

「CSSで簡単に出来るよ！」
「このタグを使えば大丈夫！」

など、検索すると色々見つかりますが、環境が違えば状況もいろいろ。

いろいろな方法を試して無駄に時間を消費してしまわないよう、素直にGoogle公式で解説している、

広告コードを<div align=”center”>　</div>で囲む方法

で、サクッと解決してしまいましょう。

【TechAcademy（テックアカデミー）ブートキャンプ】

TechAcademy [テックアカデミー] では、初心者でも短期間でPython・機械学習が学べるオンラインブートキャンプPythonコースを開催しています。

過去に独学のプログラミング学習で挫折した経験のある方でも、パーソナルメンターがビデオとチャットでサポート。疑問点を直ぐに解決して次の課題に取り組めます。

オンラインプログラミングスクール受講者No.1、TechAcademy（テックアカデミー）の学習システムの内容や疑問点を聞く事ができるTechAcademy無料動画説明会も実施されているので、ぜひ参加してみてください。