Tags

, , , , , , ,

Update: My tumblr blog has new layout and design than explained here. Yet the instructions given below are still valid.

Update: “Custom HTML” has been changed to “Edit HTML” in new Tumblr interface. Please keep in mind, while reading the post below!

There are many blog websites which doesn’t allow to put any ads on your website. But Tumblr, the microblogging website, does allow you to put ads, but the way it should be done is not quite that easy like in Blogger, but still pretty simple.

When you are in a dashboard, click “Customize”, then “Theme”. Now at the bottom you see the option “Custom HTML”. Click it, and you get the whole HTML code with CSS. Now it is upto your choice, where you want to put the ads. If you want to put it at the bottom of the page, then search for </body> and put the adsense code just before it and if you want at the beginning of the page, then put just after <body>.
The result may not be satisfactory, so you may need to tweak the CSS to make it look translucent with the original theme. I take the theme “Dashed” as an example. I added the following lines under CSS code:
#ads{
background: url(URL/TO/BACKGROUND_IMAGE) top center repeat-x;
height: 112px;
border-top: 1px #fff solid;
padding: 0 20px 0px 20px;
}
#ads .inner{
height: 170px;
width: 730px;
margin: 0px auto;
overflow: hidden;
}

And now wherever you want to add the code, you can add the adsense code as given here:
<div id="ads"><div class="inner">
YOUR CODE
</div></div>

Well, that’s all. Now you have adsense on your tumblr page.

You can see the example on my own Tumblr page

p.s.: Dashed theme courtesy to http://cameron.io/projects/