I have been experimenting with image and ad placement these days. When I tried to put ad block in a post and tried to warp post content around it… man it did not work. But with little research and Googling around, was able to do so in few minutes. I am sure some of you, want to know how? In fact, it is very easy, for both image and AdSense block one has to use different tags.
Warp Text around an Image
Make sure your image size in not bigger than the post column width. After you save and upload image to your server, get the hyperlink for that and then add the following code for the placement.
<img align=”left” src=”IMAGE URL/ADDRESS” width=”120″ height=”130″></a>
For placement on right change ‘align’ value to right. In case you want to add hyperlink and other values to the image being played around with, then use following code with lot of other variables:
<a target=”_blank” style=”text-decoration: none; color: #8B31C7″ href=”URL OF THE WEBPAGE“><img align=”left” style=”border-left: 14px solid #FFFFFF; border-right: 14px solid #FFFFFF; border-top: 4px solid #FFFFFF; border-bottom: 4px solid #FFFFFF” src=”URL OF IMAGE SOURCE” width=”120″ height=”130″></a>
Wrap Text around a Google AdSense or any other Ad
First get the ad code from your AdSense account or control panel. Then just insert the following code, with your actual ad code.
<div style=display:block;float:right;margin: 5px 5px 5px 5px;> Google or any other code</div>
To play around with ad placement you change the ‘float’ value to left, right and center as per requirement. 5px 5px 5px 5px is margin spacing top, right, bottom and left respectively.
Result of this should be like as above. Image is left aligned, while Google ad on the right. Snapshot via Nazaraone
thanks buddy,, really very helpful code, i came on your site after watching this video: youtube.com/watch?v=n3V94fL6zuI
You rock..i just pasted the code and walla!!! it works well
How can I get the text to wrap around the google ads in my website. I want to do this legally. But any ad I put in the text looks terrible. Please look at my websites homepage about half way down is an ad I can’t get the text to wrap the ad. Please any help will be appreciated/
It would help if I put the site in here. I think I have learned but u guys can look and offer advice http://www.springstrutters.com thanks
The best way is
div style=”float:left”>
Adsense code here
/div>
Thank you. You are very generous to share your “knowhow”. I learned something today and will follow your advice.
God Bless
Thanks, you’re a life saver! I am not a programmer and would neve have know what to do.
good stuff!!! google should allow you to alter the outer script code cos it doesnt affect the ad in any way just the position.
Thank you very much. Your code helped me a lot.
I was having the same issue with adense images, I couldn’t get the text to wrap. I finally threw the code in a table and aligned the table to the left. I know most people try to avoid tables…as do I. I try to stick mainly with css but this was an easy quick fix.
Thanks man!!!! Wonderful
very cool…easy to implement. thanks mate.
Thanks for the tagging. Displayed great on both Firefox 3.0 and IE6.
I don’t understand why Google does not have this information in the resource area for adsense publishers. If they do, I was unable to ever find it.
I’m not up to date on my programming languages and I spent hours looking for a way to do this. All of the results I found involved wordpress plugins and yards of code. This is by far the simplest and most precise way to do this.
Thank you
Thanks for the tutorial. I been looking for a code that works for a couple of days now and yours is the only one that seems to work for me.
@Ariel
Text spacing wont be affected, if you paste the code in template.
Excellent! It works. I have a question though, How can I paste it without modifying the type space that surrounds the ad?
Thank you
hey, thank you….sometimes this website stuff can be very frustrating – thanks for making it that little bit easier!
This worked so well. This was a huge help.
Thank you!
Rachel
Thanks. Very helpful code.
thanks man , really helpfull to me & im sure to many people out there.