Open workspace

Implementation guide

Display ad

Display ads

The classic AdSense ad: a rectangle or a strip that you place wherever you want and that can adjust itself to the screen size.

  • AdSense
  • mobile and desktop
Desktop
Mobile

Understand it in 1 minute

What the display ad is

The display ad is the best-known AdSense type. Think of a poster hanging on the school wall: it stays in a fixed place and everyone passing by can see it. On a site it is the same. You choose a space on the page, paste a piece of code there, and Google places an ad in that space.

There are two ways to create this ad. The first is responsive, which is what Google recommends. It works like water in a glass: it takes the shape of the space where it was placed. If the person opens the site on a computer, tablet or phone, the ad works out the right size by itself. If the person rotates the phone, a new ad of the right size is loaded. The second way is fixed, where you choose the exact width and height, for example 300 by 250 pixels. Google warns that with a fixed size there may be fewer ads available, and this can reduce earnings.

The sizes Google points to as the best performing are 300x250 (medium rectangle), 336x280 (large rectangle), 728x90 (leaderboard), 300x600 (half page) and 320x100 (large mobile banner). With the phone held upright, the responsive ad can stretch and take up the full width of the screen, because Google's tests showed it performs better that way. This only happens when the system thinks it will give a good result and a good experience for visitors.

The display ad is worth using when you want to decide with your own hands where each ad shows, for example at the top of the article or beside the text. Just remember that the chosen place must follow Google's placement rules: the ad cannot be disguised as content, you need care not to leave it right next to menus or buttons, and the screen cannot have more ads than content.

Step by step

How to implement

  1. Open the ads menuSign in to your AdSense account, click Ads and then By ad unit.
  2. Choose Display adsClick Display ads and give the unit a descriptive, unique name that is easy to recognize.
  3. Choose the sizeSelect Responsive, which is recommended by Google, or Fixed, if you want to enter an exact width and height.
  4. Get the codeClick Save and get code and copy the unit's code.
  5. Paste it on the pagePaste the code between the body tags, at the exact spot on the page where the ad should appear. Then click Done.
  6. Wait for it to appearAds usually show up within a few minutes, but it can take up to an hour. If they do not show up, check on the Sites page whether your site already has the status Ready.

Implemented example

The code and how it looks on screen

This code goes inside the body, exactly in the place on the page where the ad should appear.
<script async
     src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-0000000000000000"
     crossorigin="anonymous"></script>
<!-- Anúncio de display responsivo -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-0000000000000000"
     data-ad-slot="1234567890"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

<!-- Versão de tamanho fixo (728x90) -->
<ins class="adsbygoogle"
     style="display:inline-block;width:728px;height:90px"
     data-ad-client="ca-pub-0000000000000000"
     data-ad-slot="1234567890"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
On desktopIt appears as a rectangle or a strip in the space you reserved, for example a 728x90 strip at the top or a 300x250 rectangle beside the text.
On mobileThe responsive ad adjusts to the screen width. With the phone held upright, it can take up the full width of the screen.

What Google recommends

Do and don't

Allowed

  • Choose the responsive size, which is the one Google recommends, or a fixed size.
  • Use the sizes Google points to as the best performing: 300x250, 336x280, 728x90, 300x600 and 320x100.
  • Put the code inside a div or a table to position the ad, for example centered on the page.
  • Write a label above the ad. Google's policy only allows the labels Advertisements or Sponsored Links.
  • Place several ads on the same page, as long as the screen never has more ads than content.
  • Set the responsive ad size for each screen width with CSS, following the example in Google's help, and then test on several devices.

Not allowed

  • Ask for clicks, with phrases like click the ad, or say that clicking helps the site. Giving any reward in exchange for a click is also prohibited.
  • Place the ad near menus, links, download buttons, play buttons, video players or game windows, where the person might click by accident.
  • Use arrows, symbols or flashy animations to draw the eye to the ad.
  • Place the ad under misleading headings such as Resources or Useful links, or make it look like site content.
  • Have more ads than content on the screen, or show ads on screens without content, such as thank-you, error or exit pages.
  • Make the page or the ad reload on its own, without the person asking.

Tips

To do it right

Watch out

Common errors

Code outside the body

Pasting the unit code outside the body tags stops ads from displaying properly.

Box without width

If the responsive ad sits in a box with no defined width, such as a floating element, it cannot work out the size. Set the width with CSS media queries.

Locked height

A box with a fixed or limited height disrupts the responsive ad. Google recommends avoiding this.

Script that hides content

Scripts that run before the ad and hide parts of the page can stop the size calculation. The recommended fix is to set the size with CSS media queries.

Frequently asked questions

Responsive or fixed, which should I choose?

Google recommends responsive. Fixed may have fewer ads available, which can reduce earnings.

How long does it take for the ad to appear?

Usually a few minutes, but it can take up to an hour.

How many ads can I place on a page?

The policy does not set a number. The rule is that the screen must not have more ads than content, and Google reminds you that less can be more.

Does rotating the phone change the ad?

Yes. When the screen changes orientation, a new ad of the right size is loaded. The previous one is kept and comes back if the person rotates the phone again.

Can I hide the ad on small screens?

Yes. Google's help shows how to use CSS with display none to hide the unit at a screen width. Hidden this way, the ad is not even requested.

Library

Official Google source

Everything on this page follows Google's official documentation. Read it straight from the source:

Does your site use this format the right way?

The audit reads the site as a visitor would, without clicking anything, and shows what to fix.

Run an audit