How To Add Google Adsense To Blogger Posts And WordPress Without Plugins

Few days ago, a regular visitor of this blog contacted me through email asking for help in regards Google Adsense ads not showing on the PC (Desktop) version of his blog although it shows on the mobile version of same blog.

Google Adsense

His message reads thus:

Hello good morning bro, Please i am a blogger and a regular visitor and subscriber of your blog. Bro please, I have a problem and would be very grateful to you for your help. The problem is Google adsense ads on my blog don’t show up on Desktop (PC) but shows on mobile. Please, what could be problem and possible remedy. Thanks in advance.

The simple solution I recommended to him was:

Generate and create an ad code from your blog and post on the desktop version of your blog using widgets.

He then contacted me saying he doesn’t really have an idea on how that can be done and I have decided to put up this post in other to aid those who may be experiencing the same issues. Or perhaps, who may be in need of the same information.

I never asked him what blogging platform he was using, Hence, I will be talking about how to Add Google Adsense to Blogger and WordPress Blogs Without Plugins.

If using a blogger blog, the process is very much easy compared to WordPress. Especially if the email account used for the blogger blog is the same as that used in getting the AdSense account approval. If using WordPress, it’s required to create and copy the ad script and place it where ever you want it to be on the blog.

Let’s talk a bit more extensively about this.

How To Add Google Adsense To the Desktop Version Of Blogger

I am going to be using a simple process here and that entails using the default option in adding adsense to somewhere around the sidebar.

For blogger blogs, adding AdSense to the below post title and below post content is pretty technical. You need to have an understanding of blogger HTML codes in other to fix that.

If the google adsense account email is the same as the email address used in creating the blogger blog, simply visit www.blogger.com and log in to the blogger dashboard.

==> At the left-hand side of the page, click on Earnings. When asked ‘show ads on blog’, click Yes, and under the display, choose how you want ads to be displayed on the blog.
Add Google Adsense to blogger blog

==> Display Ads in the sidebar posts is highly recommended. When done, simply click on save settings. Now, view your blogger blog and you should see ads showing on the sidebar and at the end of the blog. Doing that should also display ads on the mobile version when the blog is been viewed from a high-end mobile device like android.

Alternatively, you can display ads in the sidebar and other locations via widgets.

Steps:

Log into your blogger blog. If you have more than one blog, choose the preferred blog to which you want to make adjustments.

On the left side of the page, Click On Layout. Pick a position where you want the ads to be and click on Add a gadget.

A new window should be displayed at this point. Simply click on the + icon next to the Adsense icon.

Adsense should automatically be placed at the location you specified. It may take a few minutes for the ads to begin displaying in that position when you view the blog. Hence, if it doesn’t display automatically, give it a few minutes.

Adding Google Adsense To Blogger Blog Posts (Desktop and Mobile)

Adding Adsense to blog posts on blogger blogs is a bit more tricky. This requires a knowledge of HTML codes. Thankfully, this guide should aid you in getting that done.

The essence of adding adsense to blog posts cannot be overemphasized. With adsense displaying before and after blog posts, CTR is better improved. In advertising terms, CTR simply means Click Through Rate and it means the percentage of times people click on an AD in relation to the number of times the AD was seen.

If you aim to improve your click-through rate which should result in better earnings over time, you should consider adding Google Adsense to your blog posts and this is how to get it done on blogger blogs.

Step #1 – Create The Google Adsense AD Unit

  • First, log into your Google Adsense account. When that loads up, click on the My Adds tab (It’s often on the left side of the page).
  • Click the “New ad unit” button if you do not have an already created ad unit. You can also choose Links Units if you want.
  • Select the preferred ad size of your choice. I would recommend going with the responsive AD unit. The reason is that with the responsive ad unit, the AD will fit into whatever device the user uses in viewing your blog post.
  • Fill in other options, save, and get your ad code.

Step #2 – Parse The AD Code

By default, you can’t just copy and paste AdSense into the blogger HTML session and expect it to work. You’d have to first, parse the code.

  • Go to http://www.freehtmlparser.blogspot.com/
  • Copy and paste your ad code inside the box and click the “Encode” button
  • Copy and paste the code somewhere. I would recommend using a notepad for this. The notepad should be found on your PC as long as you are using a recent Windows OS or Mac OS.

At this point, you will need to add your parsed code in the codes below before using it in your blog’s template. The reason for this is to avoid mistakes.

Using the notepad app, input and copy the parsed adsense code in the appropriate position as indicated in the code below:

    <b:if cond=’data:blog.pageType == “item”‘>
<div style=”text-align:center;”>
Paste your parsed Google Adsense code here
</div>
</b:if>

The codes above are conditional tags that restrict the Ads to post pages ONLY. If you want the AD to be displayed at the left rather than the center, change the center condition to left. If you want it to float to the right, change that to right.

Step #3 – Add the AD Code To Blogger HTML

The next and final step in this regard is adding the code in your notepad, to the blogger blog via the HTML session.

  • First, log in to www.blogger.com
  • Go to “Theme” > First, back up your current theme codes by clicking on Back Up/Restore. Save that in a location you can remember on your computer.
  • Next, click on “Edit HTML”
  • Once the HTML loads successfully, click anyway inside it (there is no option that states click anyway inside it. What this means is, to click any option in the html codes).
  • Press CTRL F on your keyboard to bring up the “find” box as seen below

Now, copy and Paste <data:post.body/> in it and hit the ENTER key on your keyboard. This will help you locate the need code amidst the html codes.

If you find the <data:post.body/> code more than once in your template, paste that code on your notepad above the SECOND and THIRD <data:post.body/> code if you want your ad to be displayed below the post title/at the top of the post.

When done, click on save theme. Open a new tab and visit a post on your blog. If it doesn’t display immediately, give it about 10 minutes and try accessing another post. However, if anything seems wrong, simply restore back the downloaded theme and try again.

If you need further help with me, you are welcome to hire me. This can be done within a few minutes.

How To Add Google Adsense To WordPress Blogs Without Plugins

Adding Adsense to a WordPress blog can be very easy using plugins. All you need do is create the code, input it in the necessary area in the plugin, select the position you want it to be displayed in, and voila. It’s that simple.

However, if you’ve read about WordPress optimizations, having too many plugins can slow down your WordPress Blog. Hence, it’s often a better idea to avoid the use of plugins for simple tasks you can have on your blog.

For WordPress blogs, it’s a little different. You need to log into your adsense account, create and copy an ad code and paste it under the text widget to the sidebar of your blog.

Steps To Adding Adsense Code To WordPress Blog

==> Visit www.google.com/adsense and log into your AdSense account.
==> Amongst the top menus, click on ‘My Ads‘ and click on ‘New AD Unit
google adsense dashboard

==> Enter the necessary information and click on Save & Copy code. Copy the code (Ctrl + C) and it’s now time to log into your WordPress Dashboard.

==> Knowing that we cannot use AdSense on free WordPress (wordpress.com), I am sure by now, you are aware of the fact that we are making reference to self-hosted WordPress (WordPress.org) blogs.

==> Visit www.yourblogurl.com/wp-admin/ (Yourblogurl is your custom domain name e.g hubsidy.com/wp-admin). Log into your dashboard and navigate to Appearance.

==> Under appearance, click on Widget. Drag the text widget to the position where you would want it to be on the sidebar.
add google adsense to wordpress blog via widgets

Paste (Ctrl + V) the ad code into the text box and click on save. Now view your blog and you should see google adsense displaying on the side of your blog.

Adding Google Adsense To WordPress Blog Posts Without Plugin

In other to add google adsense codes to WordPress Blog posts without a plugin, you need to understand a bit of WordPress codes.

This option requires you to add the code to the theme files. Unlike in the case of a blog, you do not need to parse your AdSense code. All you need is to have the generated AdSense code and navigate to the single.php or content.php file on your theme.

Locate where it’s stated the_content or the_post. These tags differ depending on how the theme was coded. Just simply paste the AdSense code before and after the_content. This will make the theme visible before and after the post on your blog.

It’s actually that simple. If you need further help with this, please be sure to leave a comment using the comment session and I will reply as soon as I can.

Samuel is a Tech Enthusiast who loves to explore everything that concerns Tech. Most of his explorations and guides, he shares via this platform. He studied Computer Science and prefers being simply called Sammy! 😉