With the Background Ads placement in Advanced Ads Pro, you can transform the unused background space of your website into a highly converting and attractive looking ad space. This page contains the main documentation of this also “Skin Ads” called ad position.
Here are the most important facts:
- Placement: “Background Ad”
- Ad Types: “image” only
- Ad Groups: random or ordered group type
- passive cache-busting works, AJAX cache-busting doesn’t
- click tracking with the Tracking add-on works
- the ad is always opening in a new window.
In order to set up background ads, you actually only need one image ad and the Background Ads placement.
The image ad does not need more than the image uploaded and the url entered. If you are using the Tracking add-on, clicks on the background ad will also be counted.
After greating the image ad for the background, go to Advanced Ads > Placements and create a new placement. Look out for the following icon.
After selecing the type, choose a name and the image ad you created (or the ad group if you have one).
The background ad will show up right after you saved the placement.
Setting up a background color for the skin ad
When you click on “advanced options” below the item field in the placement settings, you can also set a background color. This color is filling the background when the image ad does not fill the space at the bottom.
Custom Layout (custom CSS)
If you need a layout adjustment when the background ad is displayed, like a larger margin to the top if the background image also contains important content in the top middle of the page, you can use the CSS class added to the body. The class name is the ID Prefix from the plugin options + “body-background”. So in case your prefix it “examp-“, the body class is examp-body-background.
Best practises for background ads
The background ad image is stretched to fit the whole width of the website, so make sure, that it is large enough. At the same time, you should try to reduce the size of the image file as much as possible to load it faster.
The skin ads are fixed on top of the page. If the image does not cover the bottom, the background color is applied. For a better user experience we recommend to create a background ad image that fades into a single color at the bottom, so that the transition into the background color is not visible.
If your theme does not show the background on smaller devices, you might want to disable it using the “browser width” visitor condition. This will save a lot of bandwidth for mobile users.
The skin ads are using the body element of your website. It might happen that this element is covered by a larger element and the skin ad is only partially or not visible at all. Please contact us referring to this manual. We’d like to learn more about possible ways to solve this.
It is also possible that the body is visible, but not all areas are clickable. The issue here is that a larger element with a transparent background covers the background ad. If you think this covering area is too large, please contact your theme developer to change it. He can either adjust the theme or use the code below to set the background to another element:
add_filter( 'advanced-ads-pro-background-selector', 'my_custom_background_selector' );