How to Align Adsense Right or Left in your Blog Posts

If you are wondering how to align your Adsense ads in your blog posts to the right (float right) (as I have it when you go to the page) or align to the left (float left), then follow these simple instructions.

I use the Adsense Deluxe Wordpress plugin, so if you haven’t already done so, it is a good idea to add the Adsense Deluxe plug-in first or similar Wordpress Adsense plug-in which you can find in the Wordpress plugin directory. An adsense Wordpress plugin will make it easier when you want to change your Adsense code so you don’t have to edit every post, you just change the code you added in the plug-in and it changes the code for all your ads on your blog. If you don’t use wordpress, you can still use the following instructions, but you will need to place your full Adsense code in place of the Adsense Deluxe code.

After you have set up your Adsense Deluxe Wordpress Plug-in with your Adsense code, you just use the following code and add the Adsense Deluxe code for the ad you want to appear in place of the “ADD CODE HERE” text…
<div style="display:block;float:right;margin: 5px 5px 5px 20px;"> ADD CODE HERE </div> <p>
(leave out the p with arrow brackets at the end as wordpress is adding it in to the code and it shouldn’t be there)

…and place it at the start of your post and start typing your article right after as shown in the image just below…

The above code will align your adsense ad to the right (float right) in the blog post as I have mine when you’re on the page. (I have my blog set to show the blog post ads only when you’re on the page of the blog post).

If you want to align your adsense ads to the left (float left) in your blog post, use the following code (replace “ADD CODE HERE” with the Adsense Deluxe code for the ad you want to appear)…
<div style="display:block;float:left;margin: 5px 5px 5px 20px;"> ADD CODE HERE </div> <p>
(leave out the p with arrow brackets at the end as wordpress is adding it in to the code and it shouldn’t be there)

If you created different Adsense ads in Adsense Deluxe you can replace the Adsense Deluxe code with the one you want to appear. As you can see in the image I’m using one that I created which is called “skyscraper” which aligns to the top right in my blog post because I placed it right at the start of my blog post. (Remember when changing the Adsense deluxe code, the code includes the part that looks like arrows).

You can also change the margins to what you want, but I recommend leaving them as they are in the code I provided at 5px for the top, right, bottom, and 20px for the right. That will leave the appropriate amount of space between your Adsense ad and your blog post text, as you can see with my ads. It makes it look better because you don’t have the text too close to the ads and you also don’t want too much space between them.

You can also place the code further down in your blog posts, as I did with another block, if you want your ads to appear further down so your readers run into the ads while they are reading your articles.

If I am using a wide image at the top of a blog post I like to place the adsense ads a little further down (example) into the post. You can try different ad placements to see which work best for you.

If this tutorial has helped you please feel free to post your comments below.

If you need some help or if you have any questions please post them below and I’ll answer them when I can.