Order a Free SIM Card With 5 Pounds Free Credit

How To Align Adsense Ads With HTML

If your using a website or blog platform that uses HTML and your not familiar with the language code it can be very frustrating to accomplish even the most basic of tasks. If your new to Adsense and websites chances are your probably not a wizkid with HTML yet. Stick with it and you will be. This post will show you how to how to align Adsense Ads on websites and blogs using quick and simple HTML coding.

First off is just using a simple "DIV" command. Generate your Adsense code for the Ad you want to display on your website. Place the Adsense code into your page, and at the top of that Adsense code place this HTML code: <div align="center"> Then at the bottom of your Adsense code place this closing HTML tag: </div>

<div align="center">
Your Adsense code here
</div>

If you use this method remember that you can also align your Adsense left or right as well. So it will look like this: <div align="right"> with your ending </div> I'm just using "center" above as an example. Please Note: If you use this method never forget the </div> tag at the bottom of your Adsense code. This closes the code and It needs this to work correctly.


The <div> HTML should work fine on your website, however some websites can have problems with <div> tags if the website is already using many of them. I have had problems with this myself in the past. Be warned: When using too many <div> tags, specially closing tags </div> it can really mess your web page up, so make sure you keep track of which div tags you have added manually that weren't already there. If you remember that you'll be fine, even if you get a problem. if your web page looks really messed up after adding div tags it's just a case of finding your <div> code and deleting it so your page goes back to the way it was.

The second method to use if <div> HTML doesn't work for you is <p> tags.  So the same as above. Place <p style="text-align: center;"> above your Adsense code. And place: </p> below your Adsense code.

So it will look like this:

<p style="text-align: center;">
Your Adsense code here
</p>

Again, I have used center as an example and you can use which ever alignment you like.


If both of these methods fail then try this HTML  above your Adsense code: <div style="text-align: center;"> and don't forget the closing </div> below! Have fun!

How To Wrap Text Around Adsense Blocks

From reading about Adsense on the official websites, Google encourage Adsense publishers to use the best performing ads to generate more clicks. More clicks for you means more money for both you and Google. It's a win win situation. The best performing Adsense ads are the 300 x 250 square and the 336 x 280 large square. No one actually knows for sure why these ads perform best but maybe it's because they are more visible and more "In your face" then the other ads. Or maybe they look more inviting. Who knows.

Anyway, these two best performing Adsense ad sizes also perform best in two different areas on a web page. The first location is when the Adsense ad is placed above your content and below you title, so it's the first thing the visitor will see. The second ad position is putting your Adsense ad mixed in with your written content. This is one of the best places to have your ad because again, visually it's very hard to miss.

Today I will show you how to wrap your Adsense square ad around your text so that it sits along side your written content.

Just add the following HTML below to your Adsense code:

<div style="float: right; margin: 10px;">
Your Adsense code here
</div>

You can change the margin and alignment to suit your needs.


This is the best method I have come across for wrapping text around Adsense ads but others do work. If the code above doesn't work for you then you could try adding a table. Adding a table is a good method for normal / basic HTML static websites.


Table for wrapping Adsense around text:

<table align="right">
  <tbody>
    <tr>
      <td>
Your Adsense code here
</td>
    </tr>
  </tbody>
</table>


Again, you can change the alignment to what you like.

Popular Posts