How to correctly add Google Adsense ads in your post body with CSS

Google Adsense ads can be injected into the posts with marigin and with your template CSS quite easily, if you know know to do it.Also with a lot of recent changes in adsense as well as in Google' Blogger policy , things have become different and actually much easier.

#1)Decide Upon a Ad size 300 * 250 works out the best , and also make sure that it is Text/Image Ad
Get it's ad code.It will look like this.

<script type="text/javascript"><!--
google_ad_client = "ca-pub-8647056348694048";
/* In_Posts */
google_ad_slot = "2439301547";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
Now this needs some formatting to work with blogger remove the <!-- and //--> from it so that it looks like this

<script type="text/javascript">

google_ad_client = "ca-pub-8647056348694048";

google_ad_slot = "2439301547";

google_ad_width = 300;

google_ad_height = 250;

</script>

<script type="text/javascript"

src="http://pagead2.googlesyndication.com/pagead/show_ads.js">

</script>

Now only it will work.

#2)Decide where to place your ads , along the left or right , left ads have increased CPC !

#3)Open your Blogger Template.(Blogger Dash Board | Design | Edit Template)

Search for 

.alignleft or .alignright 

Based on left or right of the ads to be placed , copy the text in the brackets 
Example:-

.alignleft {
float:left; margin:5px 15px 5px 0;
}
.alignright {
float:right; margin:5px 0 5px 15px;
}

In my CSS , i have this so i will be copying 

float:left; margin:5px 15px 5px 0;

or

float:right; margin:5px 0 5px 15px;


#4)Now Expand the widget templates and then it is time to inject the ad codes!

After expanding the widget templates, search for post-body entry-content

Immediately after that line inject your adsense code like this.

 <div class='post-body entry-content'>
<div style='float:left; margin:5px 15px 5px 0;'>


<script type="text/javascript">



google_ad_client = "ca-pub-8647056348694048";



google_ad_slot = "2439301547";



google_ad_width = 300;



google_ad_height = 250;



</script>



<script type="text/javascript"



src="http://pagead2.googlesyndication.com/pagead/show_ads.js">



</script>

</div>
<data:post.body/>


Now LOOK AT IT CAREFULLY!


Replace YOUR adsense code.


In the div style , tag(<div style=) replace the code you copied earlier! step #3)!


Now save the template and check it out!


If you have any comments , comment it down!

Share on Facebook Share on Twitter Share on Google Plus

About hacktohell

Love technology.