How to Code Mobile and Desktop DFP Ads on WordPress

Gravatar Image

DFP stands for DoubleClick for Publishers and as the name implies, it’s used by various publishers as either an ad server or it can provide a lot of benefits to manage the sales process on behalf of the company. Several popular ad networks such as AdSense by Google, are usually run on DFP if the publisher chooses to.

One of the biggest challenges in the advertising world, for publishers, is to find a solution to display ads optimized for – desktops and mobile devices, simultaneously.

If you’re using website builder for creating your website you shouldn’t be worried about this since almost all best website builders make this resize in automate mode. But if you decided to use WordPress read the instruction below. In the following guide, you will learn to build responsive ads that resize themselves according to the device used by your visitors.

How do I place DFP Advertisements on my WordPress website using DoubleClick for WordPress plugin?

To automatically place responsive ads on your WordPress website in a convenient way. Follow the 3 given steps.

Step 1: Setting up the Plugin

  1. Download the ‘DoubleClick for WordPress’ plugin. The method does not require you to copy and paste header and copy tags. The plugin automatically generates it by itself.
  2. To integrate, first head over to the settings page in your WordPress configuration. Choose the ‘DoubleClick for WordPress’ and enter your network code from DFP.

Mobile and Desktop DFP Ads

Step 2: Ad Placement

You have now setup your plugin and are ready to place advertisements. There are 2 ways to place your advertisements – Reusable Widget and Theme Function.

Reusable Widget Method

  1. The space allocated for the ‘identifier’ field is the name of the line item in DoubleClick for Publishers. For the ad to load successfully, you need to match the same identifier set in the widget with the line item name. If the field is left blank, the plugin loads a random inventory from the DFP account.Mobile and Desktop DFP Ads
  2. The next setting is the ‘Breakpoints’. Here you must provide the exact size you want your ad to resize up to. Options for a tablet, mobile, and desktop are provided, enter your preferred resolution. The ‘Lazy Load’ option can be checked if you want the ad to first load before it’s visible on the user’s screen.Mobile and Desktop DFP Ads
  3. If you would like a universal size for your ad to show on all devices, then provide the breakpoint as the same resolution in all device fields. If you wish to increase the size on a desktop and lower the ad size on a mobile, provide the appropriate Inventory Size for each of the devices.

Theme Function Method

  1. This is an advanced user method and should be used by people who are proficient in coding. The variable defined by the plugin to make it possible for you to define breakpoints directly in the theme is – global $DoubleClickMobile and Desktop DFP Ads
  2. The variable to register a breakpoint is – $DoubleClick->register_breakpoint($identifier,$args) and the variable to place an ad is – $DoubleClick->place_ad($identifer,$size,$breakpoints)
  3. For individually targeting breakpoints and defining them use the functions.php variable.

Step 3: Targeting Criteria

This is the final step; this part is meant to set up the type of ad and what the line items should serve.

  1. For example, you might be running a clothing business where you sell garments in your online store. You could place ads related to the fashion industry in your ad. So, creating custom criteria for clothes can allow you to check the option in the ‘Targeting Criteria settings’.
  2. The WordPress command is Page for targeting ‘admin’ and ‘front-page’ values
  3. The Category command groups up all the values of a common class in the WordPress category.
  4. Tag is the WordPress command that is used to control all the tags related to WordPress.
  5. To define the target in DFP, you need to choose the ‘New Key’ option in ‘Custom Targeting’. Enter the name of the category whether sports, literature, food, etc. and choose the ‘Value types’.
  6. If you know what your category is specific about, then choose the first option. If it’s an unclassified group of thousands of articles, choose the 2nd option ‘Users will select from predefined targeting values’. On the next page, select the appropriate values up to 200 at a time
  7. For every new line item under custom criteria, select the relevant value within the menu. And the line item will only showcase the targeted category of ads.

And that’s it! You are on your way to placing advertisements using the DoubleClick for WordPress plugin without any headers or tag commands. The ads will be resized based on the type of resolution provided in the 2nd step, so ensure you provide the required breakpoints.

How do I Implement Google DFP into WordPress using Advanced Ads plugins?

A Google DFP tag consists of two parts unlike a single tag found on AdSense. The first part is a header tag that contains all the information of the related ad, this includes unique IDs. The second part is the tag for the ad unit, that is meant for each ad.

  1. Simply download Advanced Ads for WordPress, this plugin allows you to customize ad weight, display ad conditions, and important criteria. The plugin is great for beginners who are new to WordPress and requires very little effort to set up ads.

2. Ensure your WordPress website and plugin versions are updated to their latest builds. Now locate the ‘Advanced Ads’ section and choose ‘Ads’ and ‘Create a New Ad’. Name your ad by giving it a title and choose the type that fits your ad – Plain text, Image Ad, Rich Content, or AdSense.

3. Next, choose the size of the ad, most regular ad sizes are between 200 to 300. If you have a need to create any margin to another element, go to the ‘Layout’ options. On the ‘Display Conditions’ you can choose if you want your ad to show on your preferred page or on your homepage.

4. The most important portion is the ‘Visitor Conditions’ section. Here you can choose the type of audience that sees your ad. Choosing ‘Mobile Device’ will make your ad visible to visitors who visit your site through mobile devices and hide the ad from desktop users. Select the ‘Display by browser size’ option to enable your ads to resize to the width of the user’s device.

5. Now click ‘Publish the ad’ and Voila! Your ad is responsive to all devices.

You have successfully published your very first ad using this guide! Following these steps to the point will ensure that anyone with limited coding knowledge are able place their ads professionally on their website.

Below are tips you can follow to ensure you know the do’s and don’ts of how to place your ads in the right way.

Match the Header and Body Text

To ensure you have no false impressions created by every visitor click, it’s important to match the code between the ad ID within the head text and the ad ID as well. This solves the problem where Google DFP preloads the ad in the header content but doesn’t display the ad. Always double check the numbers and never mix them up.

Optimizing Ads to the fullest for every specific device using Advanced Ads Pro plugin

For a professional site, it’s critical to utilize heavy duty features such as Cache-busting, limiting the number of times your ad is displayed, created ad grids, and injecting ads targeted for individual users.

Advanced Ads Pro allows you to create ads that allow you to do all the above elements and much more. You can place your ad at any position you like – frontend or backend. The plugin allows you to fight ad blindness by posting ads on random positions to ensure users have a glimpse.

Advanced Ads Pro allows you to set visitor condition commands such as showing ads to visitors directed by a search engine vs ads that are shown to someone directed by a partner site or through an affiliate link. These conditions can also be expanded to allow ads to be shown on specific browser windows.

The cache-busting feature allows your visitors to see the ads with very low impact on their browsing devices. You can create ads that work either with the cache provided by the plugins or on your hosting. The cache-busting feature can be set to automatically disable itself.

The plugin also offers support for the latest ad type – flash files. Using the .swf web format, you can select the preference of your ad type and link directly to the URL of a flash file or upload one from your media gallery.


The one-size-fits-all solution doesn’t exist in the advertising world if you intend to a build a responsive website. The breakpoints should be set based off the website design to appropriately resize ads according to the smaller display devices. Ad slots need to be proportionally placed depending on the viewpoint.

Having a background in coding can help the user build a more responsive website. With the following guide, you can relatively learn the fundamentals of applying a few lines of code to place your own ads without hiring the service of a digital advertiser. To find out more about website development related topics, click here.