Where to place the ad code in your HTML (ad units)

by

After you get and copy your ad unit code, you need to paste it between the <body> and </body> tags of your page. If you paste the ad code outside the <body> tags it will prevent your ads from appearing correctly.

Tip: For help with HTML, try searching for online resources using terms like “HTML basics“

Example HTML page before the ad unit code has been added

<html>
<head>
This is the head of your page.
<title>Example HTML page</title>
</head>
<body>
This is the body of your page.
</body>
</html>

Example HTML page with the ad unit code added in the body

<html>
<head>
This is the head of your page
<title>Example HTML page</title>
</head>
<body>
This is the body of your page.
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%20async%20src%3D%22https%3A%2F%2Fpagead2.googlesyndication.com%2Fpagead%2Fjs%2Fadsbygoogle.js%3Fclient%3Dca-pub-1234567890123456%22%20crossorigin%3D%22anonymous%22%3E%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;script&gt;" title="&lt;script&gt;" />
<!-- Homepage Leaderboard -->
<ins class="adsbygoogle"
style="display:inline-block;width:728px;height:90px"
data-ad-client="ca-pub-1234567890123456"
data-ad-slot="1234567890"></ins>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%3E%0A(adsbygoogle%20%3D%20window.adsbygoogle%20%7C%7C%20%5B%5D).push(%7B%7D)%3B%0A%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;script&gt;" title="&lt;script&gt;" />
</body>
</html>

Positioning the ads on your site with HTML

Just like the other elements of your site (images, paragraphs, etc.), you can change the position of your Google ads by using HTML tags (<div>, <table>, etc.). For example, if you surround your ad code with the HTML tags <div align="center"> and </div>, your ads will appear in the center of your page.

<html>
<head>
This is the head of your page
<title>Example HTML page</title>
</head>
<body>
This is the body of your page.
<div align="center">
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>
<!-- Homepage Leaderboard -->
<ins class="adsbygoogle"
style="display:inline-block;width:728px;height:90px"
data-ad-client="ca-pub-1234567890123456"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</body>
</html>
Note: This is sample code only, please don’t use it in your own site’s HTML.

Leave a Comment