How To Wrap Content Around Google Adsense Ads

I visit a lot of blogs each day and something that really bothers me is that most blogs that I visit, I itch a little knowing that these hard working authors could squeeze out a few more dollars each day if their Adsense ads were better placed on their blog. This article will show you how to include Google Adsense ads in your post and make them look nice. It’s a quick and easy post for me to publish … and I think it will return a lot for you. So… win/win for all! Enjoy!

Example #1:
adsense-ad-screenshot-1

The above image is an example of what I see on a lot of blogs. The Adsense code is placed on the post page, but its directly above the content. In all honesty, I think even my 9 year old kid could spot this out as being an advertisement. And lets face it… “People Hate Ads” … I don’t click on them, neither do you and the same goes for your readers if your ads are poorly positioned.

Example #2:
adsense-ad-screenshot-2

That looks much better! I have wrapped my post content around the Google Adsense ads. This can make a world of different in how well these ads perform for you on your blog. Here is how to do it.

Step One: Open and make a back up copy of your style.css file.
*This file is located in your /wp-content/themes/YOUR THEME/ folder.

Step Two: Download my Adsense Wrap and insert the code in your style.css file.

adsense-wrap

Step Three: Open and make a back up copy of your single.php file.
*This file is located in your /wp-content/themes/YOUR THEME/ folder.

Step Four: Go snag the 200×200 text only Adsense code. The 200×200 is a nice size to work with. It isn’t too large where it will piss your readers off and it fits very nicely when you have content wrap around it. You can also experiment using the 250×250. After you have the Google Adsense code, look for these two line of code in your single.php file :
<h2><a href =”<?php echo get_permalink()
and the <div class=”entry”>

single-php

… simply paste your Adsense code in between these two lines as shown in the next image below:

single-adsense

At this point in time, if you were to save your file, the Adsense code would look like Example #1.

Step Five: This is the final step to make Example #1 look like Example #2. Simply add this line of code above your Adsense code:

<div id=”adsense-wrap”>

… and then add this line of code at the very bottom of your Adsense code:

</div>

Here is a screen shot:

single-adsense-wrap

DONE!!!! Save your work and refresh you page. Your content should be wrapped very nicely around your Google Adsense Ad.

If you should have any questions, please feel free to leave me a comment below and I will provide assistance for you. This is pretty easy to do and the pay off is great! As always, I enjoy reading your comments and feedback! :)

GarryConn

Have you considered starting your own web site? My web site is a WordPress blog and I use HostGator.com web hosting. You can start your own web site just like mine for as little as $7.95 / month using their Baby Plan. That is the web hosting plan I have and it is perfect for beginners and even experts because it comes with tons of free software to get you started. When you sign up, be sure to use the coupon code: wordpress and try them for one month only a penny!

Seriously? Do you really like to read this garbage? Subscribe to my blog.

My blog looks awesome on a mobile phone! Read my blog at work, just try not to laugh too hard or the boss will get pissed!

Also Try Searching:

Related Articles:

  1. How To Wrap Text Around Images Using CSS In Your Blog Posts? - In this article I want to show you how you can manually insert an advertisement into your post without having...
  2. How Much Money Is Google Adsense Making You? - I have quite a few sites online and most of them have Google Adsense ads along with a few...
  3. How To Increase Google AdSense CTR - I received an email from a reader who wanted my advise on increasing his Google AdSense CTR. Here is a...
  4. How To Be Successful Using Google Adsense - Do you want to know the secret to success with being successful using Google Adsense? There are no secret tricks,...
  5. Does Google Adsense Still Work? - Is is worth signing up for Google Adsense? Did I miss the window of opportunity to make some good...

RSS feed| Trackback URI

18 Comments»

Fred Wrote a Comment:

Date/Time: 10-27-2007 08:00:52 Comment #6051

Great tutorial Gary. You always create great reads. Thanks.

 
Kyle Eslick Wrote a Comment:

Date/Time: 10-27-2007 11:29:45 Comment #6057

This is a good tip Garry!

I simplified mine a bit. I used to just use a div (or span) to complete all of the above in one step:

adsensesqaure.php is the php file I use for my AdSense square. You could also just paste the code there inside the div (or span). Some people prefer everything in the stylesheet, but I have a few things I like to simplify whenever possible :)

Of course, you can now just use the Shylock AdSense plugin, which also allows you to not show the ads until a set amount of time has passed.

 
Kyle Eslick Wrote a Comment:

Date/Time: 10-27-2007 11:30:24 Comment #6058

Hmm, your code command didn’t work. Let me try this again

 
Kyle Eslick Wrote a Comment:

Date/Time: 10-27-2007 11:31:27 Comment #6059

Sorry for the spam. Looks like it won’t let me put the code in. :)

 
Garry Conn Wrote a Comment:

Date/Time: 10-27-2007 14:06:18 Comment #6064

Hey Kyle,

Thanks for sharing your tips. Drop the code into a .txt file and upload to your server and provide a hyperlink here to it, or just email the code to me and I’ll do the same for you. Also, do you have a write up on the code? If so, then I will edit my article and mention your post as well. Take care buddy.

 
Allergy Guy Wrote a Comment:

Date/Time: 10-27-2007 17:06:43 Comment #6065

Thanks for the tip and the approach. I am using Drupal and a plugin to inject the ads, so all I had to do was change the format of the ads from centred to float: left as you suggest, and the job was done in about two minutes including testing and fixing typos.

Now that the change has been made I’ll wait and see by how much it improves revenue.

 
Nirmal Wrote a Comment:

Date/Time: 10-28-2007 03:29:15 Comment #6077

You can do the same thing much more simpler. All you need to do is to add the adsense code inside a div tag with style=”float:left”. Refresh the page and you can see adsense or any other ad wrapped with the text.

 
Garry Conn Wrote a Comment:

Date/Time: 10-28-2007 03:53:01 Comment #6080

See… that is why everyone loves Nirmal… Nice work dude… very nice!

Talk about me making a mountain out of a mole hill again…

Hey man.. come on back and save the day anytime! Thanks for dropping by. :)

 
Garry Conn Wrote a Comment:

Date/Time: 10-28-2007 03:58:05 Comment #6081

For those wondering…

Nirmal is basically suggesting the same thing… but its much easier. Where with my tip, I suggested added the code to your external style sheet where he is saying its easier to add the internal style commands directly in the div tag…

It’s honestly a great tip and will save you a ton of time… I’ll provide a screen shot example… or Nirmal, if you happen to have a moment free before me… drop me a link in the comments with a screen shot and I’ll just use yours. :)

In the long run… its comments like the above that truly help people the most. Collaborating together to offer the best tips for the bloggers that need them. Thank you Kyle and Nirmal for your contributions here… this is good stuff and I appreciate it. :)

@ Allergy Guy: That is great to hear… be sure to keep me updated and let me know if it helps you improve a little bit with scoring extra clicks.

 
Mark Wrote a Comment:

Date/Time: 10-28-2007 11:39:50 Comment #6085

Good stuff, Garry. I feel it’s worth mentioning to those of your readers who write sponsored posts that including ads in such posts aren’t permitted (or least I’ve been bitten a time or two). While your method will definitely work for people who don’t write paid-for posts, using what Nirmal suggested along with something like the Adsense Deluxe plugin will help people choose when to add ads to their posts.

 
Zath Wrote a Comment: Subscribed to comments via email

Date/Time: 10-28-2007 19:19:04 Comment #6090

These are the kind of handy hints and tips that I really like reading about in a post and also the discussion in the comments from other bloggers.

Kyle - I’ve not seen Shylock before, but that could be a pretty cool plugin to try out, it sounds like you’re rewarding regular readers that would read your new posts and not see the ads, with the ads only appearing on the older posts usually found by search engine traffic!

 
ressy Wrote a Comment:

Date/Time: 10-31-2007 15:41:25 Comment #6206

thanks for the tips Garry. I usually use ready made wp theme for this purpose. Your tips will def. help me to improve it.

 
Wade Wrote a Comment:

Date/Time: 3-30-2008 17:12:34 Comment #12992

Why download a plugin? That is absurd. Just wrap a div style around the ad code. If you use Adsense Manager, you can have it call whatever you want. I have mine called inline-200 that way if I want to change the ad in that slot, I just edit the code in Adsense manager instead of having to remember single.php, or even where it is located in the source.

Example (remove spaces):

Like mentioned above, this goes after the /h2 and before entry. Now say you are using adsense for that block, but you want to switch it to TTZ media. All you do is go to the Adsense Manager and edit the code for inline-200. Boom it is changed. No hunting, no remembering. It is fool proof.

 
Exploring The Internet Wrote a Comment:

Date/Time: 4-12-2008 17:06:31 Comment #13424

Very good article here; but I used a plugin instead.
I referred your post for my visitors as an alternative. You may check it out here:

http://mycoolonlinestores.com/blog/how-to-wrap-your-text-around-google-ads.html

Lanna

 
dimaks Wrote a Comment:

Date/Time: 6-17-2008 12:00:28 Comment #15639

i tried putting in the simpler method and it dod work. did i do the thing right? i put the adsense code within div tag, just before the PostContent tag in my single.php

 
akuh Wrote a Comment:

Date/Time: 7-24-2008 21:45:53 Comment #17344

thanks for your explanation,..i have been looking around for this :)

Now I will try to my blogsome….

Anyway, could you hack blogsome code for dofollow?

Check out akuh’s last blog post..How Simple SWOT Analysis Tool Help Your Small Business

 
akuh Wrote a Comment:

Date/Time: 7-24-2008 22:38:34 Comment #17346

I try use this method on my blogsome, but it is not effect to blogsome. I use 120×240 ans 200×200. Any suggestion for blogsome? Thanks

Sorry if it is repost,…any problem on my connection.

 
Taeran Wrote a Comment:

Date/Time: 7-26-2008 09:21:45 Comment #17390

Hi

Thanks for your post - spent ages looking around to get this working!
Still working on layout, but at least ads wrap around now - very new to this! ( http://www.willitchangeyou.com )

 
Name (required)
E-mail (required - never shown publicly)
URI
Subscribe to comments via email
Your Comment (smaller size | larger size)
You may use <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> in your comment.

Trackback responses to this post

Garry Conn dot Com - Theme by Daily Blog Tips Themes