If you are reading this, it’s a work in progress. There are no clear instructions on how to make Google Ads work from scratch. I hope the mental torture that Google has put me through, saves you some time.
If you’re anything like me, you can put together a functional, SEO’d WordPress website quite easily and even use Google AdSense to place automatic ads.
You can probably do heaps more too BUT there are few areas in all technology that are more opaque, less intuitive, less-well documented, poorly supported, error-prone, broken, riddled with invisible, circular, self-referencing BS or come with a higher barrier to entry than Google Ad Manager and it’s associated service. Especially when all you want to do is add some ads on a site that work for BOTH desktop and mobile.
Also, if you’re anything like me, you’ll have gone through Google’s free courses, umpteen plugins that “make it easy” and even tried employing multiple people from sites like Fiverr to do it for you – after all, it’s a two-minute job once you know how, right?
Anyhow, after countless hours of either trying by myself, going round in circles with people who state it’s what they do for a living and literally communicating with Google Ads Porduct Managers, I’m still doing it myself and resuming all of the research I started long ago. Even now, tying everything together seems ridiculous and I can’t quite see how I ever discovered these solutions in the first place. Hopefully, this will all help someone else. It will also be my own go-to source when I build more websites.
For now, I’m working on installing Google Ads on High Performance Laptops but I’ll be working with SMBtech using this process once I’ve got it working.
Table of Contents
- How to set-up Google ads in Ad Manager (quick version)
- How to set-up Google ads in Ad Manager (in detail version)
- How to create the basic Google ad units in Ad Manager
- How to use size mapping to run responsive Google ads
- How to Insert Header code into WordPress
- How to bug fix Google Ads placement
- How to manually insert the Top Banner Google ad unit into the Navbar like AdSense Auto did
- Alternatives to Google Ads
- The solution… for now
- How to fix Google Ads by using an alternative
How to set-up Google ads in Ad Manager (quick version)
- Make the basic ad units in Ad Manager
- Create size mapping code
- Install Google Ads Header code
- Install Ad Inserter plugin
- Add size mapping code
- Choose locations
- Punch hole in wall when it fails
How to set-up Google ads in Ad Manager (in detail version)
What follows is almost an (in progress) Live Blog of the living hell that is getting Google Ad Manager to work on my WordPress website.
How to create the basic Google ad units in Ad Manager
The first thing to say is a BIG thank you to Tutorials by Kate on YouTube. She’ll be explaining many things about Google ads below but she makes many videos and they’re not all in helpful order for what we’re doing.
The following video walks you through setting up ad units and, most importantly, tells you what you can ignore in all those scary-sounding, configuration sections with unexplained terms in them.
How to use size mapping to run responsive Google ads
The next video is the bit that you’ll VERY likely get completely stuck on if, god forbid, you don’t want massive banners running off-screen on mobile devices. Yes, this should be much easier, but it’s not. Google’s own responsive ads don’t fix this problem either. Below the video, I’ll post the code Kate uses to cut and paste ad sizes (mine are a little different in size) into the third party coding site (because of course that’s what you need!) which can be found by clicking on this link: https://dfpgpt.appspot.com/
Min Width:
Desktop - 992
Tablet - 728
Mobile - 320
Other - 0
(Top)
mapping 1:
992x0 - 970x250, 970x90, 728x250, 728x90
728x0 - 728x250, 728x90, 300x250, 300x100, 320x50, 320x100, 336x280, 1x1
320x0 - 300x250, 300x100, 320x50, 320x100, 320x480, 1x1
0x0 - 320x50, 1x1
(side)
mapping 2:
992x0 - 336x280, 300x250, 300x100, 300x600, 320x50, 320x100, 320x480, 160x600, 1x1
728x0 - 336x280, 300x250, 300x100, 300x600, 320x50, 320x100, 320x480, 160x600, 1x1
320x0 - 300x250, 300x100, 300x600, 320x50, 320x100, 320x480, 160x600, 1x1
0x0 - 320x50, 1x1
(middle)
mapping 3:
992x0 - 336x280, 300x250, 300x100, 300x600, 320x50, 320x100, 320x480, 1x1
728x0 - 336x280, 300x250, 300x100, 300x600, 320x50, 320x100, 320x480, 1x1
320x0 - 300x250, 300x100, 300x600, 320x50, 320x100, 320x480, 1x1
0x0 - 320x50, 1x1How to Insert Header code into WordPress
NOTE: Do Not Forget to Click Save after doing this next part! The above video also tells you where to paste the Googls Ads Header Code in WordPress. In my particular WordPress Theme it can be found by going to:
Appearance > Theme Options > General Settings > Header Code > Paste
This can be seen in the below screenshot (your theme may vary):
Install Ad Inserter plugin
Kate then tells you how to paste Google’s ad unit code into your WordPress site. She recommends using a plugin called Ad Inserter which is found by searching in plugins or downloading from this site: https://wordpress.org/plugins/ad-inserter/
Add Google ad unit code to plugin
The following video tells you how to set Google ads up in Ad Inserter and paste the ad unit codes into it.
However, what you may quickly notice is that Kate makes no reference of the above Size Mapping tags we’ve just created. She starts off by talking about Hooks and having different headers for different Pages. This is slightly at odds with what we’ve just done. However, we’ve pasted the Google Ads header into our site already, so I’m not going to do it again with the plugin.
Kate also skips copies the ad unit code from within Google Ad Manager, rather than getting each modified code from this site that we’ve just created https://dfpgpt.appspot.com/
So, instead of copying the code from Google Ad Manager, copy the codes that we’ve just created. The ones that look like this…
As such, to avoid confusion, you can skip to 2m30s in the following video…
How to bug fix Google Ads placement
Now my Mobile site is showing the correct sized banner in the right place!
Unfortunately, while the video is helpful at showing how to use Ad Inserter and its default placement options, it doesn’t help if you want your top banner to be at the top (this has been the perennial problem I’ve had with ad placement – along with size mapping for mobile devices). If you put a long banner above your content, this is the Google Ads fail you can expect…
My temporary fix for this is to remove the large [970×250] and [970×90] image sizes from the ad unit code in Ad Inserter. I’ll show you how to do that below because the same issue occurred in the sidebar… This didn’t work 🙁
It also turns out that I’ve borked the sidebar too. This is because I’ve chosen a size that’s too wide. I need to remove that from the above tags. Ugh. Basically everything over 300 width is too wide for my theme. I’ve left this mistake in here in case you suffer the same issue. EDIT: No, this isn’t the cause either. I suspect it’s due to padding within the widget within the theme. That means another Support request.
EDIT: I’ll leave this potential fix here in case it helps someone fix a bug, even though it didn’t work for me: The simplest way to resolve it was go into the Ad Inserter block and delete the offending size in the code:
How to manually insert the Top Banner Google ad unit into the Navbar like AdSense Auto did
So, after doing all of this, I have working Google ads for Before Content, Sidebar and also an Island in the copy and they all work on both Desktop and Mobile. This is a big win. However, I’ve had to go to the official support forum for my Theme to find out how to get the top banner that I really want… Adsense Auto inserted it into the Nav Bar and it looked great. I don’t really want the smaller one Above Content instead.
I’ll need to find where to insert the code for that. I fear it also might break my mobile ads, but I’ll cross that bridge when I come to it. I’ll update this post when I have a fix for it. UPDATE: MyThemeShop got back to me and said where to put the Top Banner code. It seems to have worked! NOTE: I put the raw code from Ad Inserter there… not the Widget Shortcode. ALSO ALSO NOTE: This file will likely need to get updated again when a Theme Update comes out – unless I use a Child Theme.
The advice was:
Go to Appearance > Editor > header.php and look for this code there on line 176:
<div id="secondary-navigation" class="secondary-navigation" role="navigation" itemscope itemtype="http://schema.org/SiteNavigationElement">
<a href="#" id="pull" class="toggle-mobile-menu"><?php esc_html_e( 'Menu', 'schema' ); ?></a>
<?php if ( has_nav_menu( 'mobile' ) ) { ?>
<nav class="navigation clearfix">You need to add your ad code just after that and save the changes.
UPDATE: It appears it hasn’t worked. Now that Google AdSense Auto has flushed out of the system, I’m not getting any Desktop ads there at all. But I am on Mobile. The case continues…
UPDATE: Doing all this caused horrendous CLS (Cumulative Layout Shift) which is where a page loads and then shifts around annoyingly. It’s so annoying that Google itself penalises sites that exhibit it. There are several ways of fixing the issue but they mainly boil down to not having a variety of different ad sizes on your page and then reserving a gap on the page for the ad (with a known size) to load into it without shifting everything around. The fact that Google ads are the primary cause of CLS is dfgzdfgnoig… look just don’t get me started. I’ll add the best fix when I discover it. It might also mean paying for the premium plugin. I’ll update this asap. UPDATE: CLS suddenly doesn’t seem so bad today. It acts quickly like AdSense Auto did. I’ll keep an eye on it anyway.
After doing all this, I’ll need to get Google AdExchange working with Google AdManager. I’ll be basing my work on this blog to start with, but I’ll do a new article when it comes to implementation. UPDATE: The main way to get access to Google Ad Exchange is to ask your Google Account Manager. These are the people who will call you up shortly after signing up to AdSense or Ad Manager and spend a long time telling you how to optimise things.
In my case, my Account Manager ran a webcast a couple of weeks back. I asked why I couldn’t access Google Ad Exchange and he said I should be able to. I’ve just emailed him again to provide access and says,
“Looks like your account is not eligible to have an Ad Exchange Account linked. On the other hand you can link your Adsense Account. In order to get an Ad Exchange account you would need to work with one of our certified partners. (here)”
Google Account Manager
No explanation. No nothing. If I do a Google Search for something like, “am i eligible for ad exchange” the only relevant result from Google seems to be this, which deals with Eligibility requirements for Ad Exchange ads for video and games. Helpful.
If I have to work with partners do I need to pay them? Guess I’ll find out if I can’t get a straight answer from Google themselves. But first let’s see what linking AdSense to AdExchange does. UPDATE: Having tried to follow those instructions, I’ve discovered they bear no relation to reality. The only option I am given to link in Google Ad Manager is Google Analytics 4 properties. That’s it. I’ve contacted my Google Account Manager again to see if he can give some more info on this.
Update: I am seriously considering ditching everything to do with Google Ads. It’s alarming just how much time I’ve wasted dealing with this truly awful technology and the hopeless people that are employed to help run it. Will keep you informed.
Update: You see above where I quoted my Google Account Manager’s advice that I’d need to link my Google AdSense account with Google AdManager instead. After an hour of going through Google’s official instructions both written and in video and wondering why what I saw bears no resemblense to that, I’ve discovered a quote from this site: Most publishers don’t have the ability to link accounts by default. But still you have three ways to get the Adsense Demand on your side. You can contact to your account manager or support Team for this. Why on Earth would my account manager not tell me this when he advised my about it in the first place?
Update: Here’s the reply from my Google Account Manager who is also telling me they’re not my account manager anymore, but the person who actually is hasn’t replied:
Apologies for the lack of clarity here. Let me detail it.
Ad Exchange accounts can be created only by a Sales Representative, and i cold do that if your account was one assigned to me or alternatively you need to work with a certified partner to get the Adx created.
Your question on the Publisher Academy session was about Adx Features only being available on GAM360 accounts, and the answer continues the same. Adx is not exclusive to GAM360.
On the Adsense. Here are a few links. (1, 2, – part of the enablement happens within Adsense account)
(former) Google Account Manager
I’ve still NFI what much of that is about. For other novices GAM refers to Google Ad Manager 360 which is different to Google Ad Sense, Google Ad Exchange and yet somehow the same all at once. We’ll deal with that horror show later. However, once again I’ve gone through those links and they say that you need an Account Manager to activate this stuff before it even appears.
Meanwhile, we’re back to linking AdSense with Ad Manager. The latest instructions say:
Maybe final update of the day: Once again I’m wondering whether all of this is worth the effort. This is where I gave up last time I went through this hell. I can hardwire ads into the site that will perform MUCH better than anything Google can offer but the industry requires me to use this horrendous system. I need a break.
Alternatives to Google Ads
Update: It’s been two days and I gave up getting Google Ad Manager to work because it won’t without intervention from Google who still haven’t got back to me. In the end I gave up with a media kit and went to my most-interested prospect and offered them a sweet deal for hardwired ads. They said yes!
I’ve subsequently created hardwired ads on the sites – linked JPGs which I’ve positioned with no less than three different plugins and also by hacking my WordPress theme(!). A huge shout out to the My Theme Shop support folk for tolerating my attention-seeking demands regarding this.
I’m using WP in Post ads, ADS PRO and Ad Inserter. ADS PRO will likely be my go to as I’ve already bought it and it can supposedly do Mobile-Desktop responsive ad placements – but it I need time to work with it. The other plugins offer different default placements which is why I’m using both at the moment.
I’ve still got an AdSense banner running on the site in an effort to get it placed right. My Theme Shop support have it looking all nice and tidy but whatever they’ve done has made it wonky on mobile. I’ll leave it up while they fix it. But there’s another problem.
Having promised my advertiser that rival ads won’t appear on my site, they’re appearing on my site. No problem! Google Ad Manager has a setting for that. Let me go there and block the rival advertisers. Nope. Here’s the error…
Problem: A required feature is missing. Problem Problem: There is no info as to what this might be and no other settings to rectify this problem.
After half an hour of going nuts again, and discovering that many people for the past few years are having this problem – including some on Google support forums saying it’s a known bug – I actually discovered the Solution: this feature ONLY WORKS IF YOU HAVE ACCESS TO GOOGLE AD EXCHANGE. It doesn’t advertise that setting ANYWHERE.
Anyhow, I went to AdSense to see if I could block ads there. Nope. But I did find this bit of more Google Facepalm. Despite, getting bombarded with announcements about Google Analytics being depricated and replaced with GA4… guess whose service doesn’t work with GA4? That’s right… Google AdSense doesn’t. You couldn’t make it up…
Anyhow, I’ve not got some hardwired ads showing on my site so I need to track their performance. I tried using Google Tag Manager. I followed numerous “simple” how to guides for this and… just nope. Not right now. I’ll add an explainer when I get round to that.
I’ve used a URL Shortener plugin in the interim. However, while it’s counting clicks OK, it’s noting that many are from bots and crawlers. So, I’ll really need Ad Manager and/or Tag Manager properly working down the line to exclude these.
The solution… for now
Google ads is so terrible, you should offer one potential advertiser a great deal and manage everything yourself. I’ll show you how, below. But first, here’s my final path to getting there…
Giving up on Google Ads… again
My Google account rep who denies he’s my account rep, got back to me after chasing my support request that he lodged and went unanswered and said he wouldn’t help and I should go to a 3rd Party partner and pay them to do it all for me instead, if I want to use Ad Exchange. He hasn’t responded to my query about linking AdSense with AdManager… which he himself suggested. However, at this point, it’s such a terrible system, with such a terrible hit on user experience and loading delay that… forget it.
Why I gave up on the ADS PRO plugin
I tried hard getting ADS PRO to work, but it has the UX of a turd with a flood of superfluous options obfuscating everything and obvious options (like alignment) totally absent. Documentation is non-exitent, support is absent and the broken English descriptions of functions are confusing. They also won’t give you a refund if you figure this all out quickly.
They also have dozens of pre-programmed ad slots and animations… but not one of them is a top banner ad, you know, the single most popular one. Also, because ADS PRO only seems to use short codes for placing ads, you can’t add a banner above your article content – it just displays the short code text instead. I’m sure a web dev will be laughing at the stupidity of not knowing how to fix that, but this is supposed to be the easiest to use, best featured product on the market… and it’s horrendous.
How to fix Google Ads by using an alternative
The following inserts ads where you want them, for free. And it does so with no hit to page load or even CLS. I could cry…
Ad Inserter and MyThemeShop to the rescue
Ad Inserter actually is relatively intuitive if you can work out basic HTML. However, to get it to do exactly what I wanted – place a banner ad above the content – you need to use raw code and not Short Codes. If you place short codes in the Header file, it will just display the text of the short code. Fortunately, Ad Inserter doesn’t just make it easy to automatically place ads in set places, it lets you use code to place in the header too.
I’m sure all WordPress Themes are very different but the solution that MyThemeShop gave me, after plenty of trial and error, (did I mention how outstanding their support is?) got me exactly what I was looking for -> The banner appeared between my Navbar and the Content (which isn’t in the NavBar but I actually prefer the outcome).
I’ll add the code below so people can try it. Plus, there’s screenshots of where to add it…
Step 1: Add this code in the header.php Theme File under the </header> line. Hint: My host, Siteground, uses a security plugin that disables access to Theme Files. If Theme Files is not appearing in the Appearance menu, it might also be disabled by your web host’s security settings or plugin. The code is beneath the picture. WordPress automatically added the </div> tags for me.
<div class="ad-area">
<div class="container">
PUT YOUR CODE HERE
</div>
</div>Step 2: Add this code to the theme’s Custom CSS
Everything at this point, is documented in this MyThemeShop Thread – complete with more images. I won’t repeat that all here. But doing the above led to the banner being wonky on both Desktop and Mobile (and too close to the NavBar with a big gap under it). So, to partner the code in the header, we need to add this in the Custom CSS section of your Theme.
Here’s the code to paste in there. This made my top banner spacing correct for both mobile AND desktop.
.ad-area {
float: left;
width: 100%;
text-align: center;
margin-top: 30px;
}Step 3: Use Ad Inserter to actually make the ads and insert them…
Hopefully this screenshot represents all you need to know to get this working…
An explanation of the above is that Ad Inserter uses different code blocks (above numbered 1-16). So pick a number (above is Number 8) and paste your code into it – whether it’s Google Ad Unit code or a hyperlinked image. I’ll paste the hyperlinked image code below so you can modify it. All it is, is a hyperlink, image location and size. (Note: the coloured numbers in the boxes mean: Red=active | Grey=inactive/paused | Blue=Active but manual placement). If you want to place the ads in set-places (after first para etc) click the dropdown next to Insertion. Then you won’t need to manually paste any code.
<a href="https://highperformancelaptops.com.au/msitb"><img src="https://highperformancelaptops.com.au/wp-content/uploads/2022/11/970-x-250_MSI_HPL_Black_Friday_Gaming.jpg" alt="" width="978" height="250" class="aligncenter size-full wp-image-5343" /></a>I used my 970 x 250 banner for Desktop, 728 x 90 banner for Tablet and 320 x 100 banner for Phone. Hey presto, the banners appear in the right place, on the right size on the right device!
Here’s the Step 1 code I used for the Header.php file:
<div class="ad-area">
<div class="container">
<?php if (function_exists ('adinserter')) echo adinserter (8); ?>
<?php if (function_exists ('adinserter')) echo adinserter (9); ?>
<?php if (function_exists ('adinserter')) echo adinserter (10); ?>
</div>
</div>Notice how the 8, 9, and 10 in that code are simply the “PHP Function” code cut and pasted from the Ad Inserter screenshot above (Blue text in the ticked PHP Function area).
It could be argued that there’s a bit of a gappy border around the ads on mobile devices, but they don’t look so bad on actual mobile devices – I just squished the Desktop browser window to bask in the responsive glory of what I’d achieved. I hope this helps someone somewhere. I’ll have to go back to Google Ads at some point, but for now… it can get in the sea.
