Would you like to make a bit of revenue from your blog? Here’s how you can make your content work for you by adding Google AdSense to your Tumblr blog.
Blogging can be serious work, and with your easy-to-use Tumblr blog, you might be posting more than ever. You may be writing about your beautiful vacation, sharing the newest wallpaper you designed in Photoshop, or explaining how to get your dog to quit barking at frogs.
Either way, your blog takes real time, and it might be nice to make a little money from it. Google AdSense has enabled bloggers around the world to get ad revenue from their content. The Tumblr Terms of Service require that your blog be used primarily for blogging, but they do allow you to use AdSense or other ad systems as long as that’s not the primary focus of your site. It’s fairly easy, so let’s see how to add it to your blog, no matter what theme you’re using.
Please note: This article is designed for users who don’t know how to edit HTML, and so may seem overly simplified if you’re already a code ninja. But that’s no problem; just skip over the parts you already understand, and use the parts you do need!
Signing up For AdSense
Before you can add AdSense to your site, you’ll need to register for an AdSense account with Google. If you already have an account, skip to the next section; otherwise, browse to the AdSense site (link below), and click the Sign up now button.
Fill out the form as usual, with information about your site as well as some personal contact information. Make sure to check the boxes at the top with guidelines about ads, and make sure your site follows them or your AdSense account could be suspended.
Accept the additional policies at the bottom of the form, and then click Submit Information.
Make sure your information is correct, then select if you have a Google account and either enter your account info or create a new account.
Once you’re finished, you’ll have to wait between 1 and 3 days for your account to be approved. Once you receive your conformation email, head back to the AdSense site, but this time, log in with your Google account info.
If you have problems with AdSense, or need more info about your account, check out Google’s AdSense Help Site (link below).
Create an AdSense Unit for Your Tumblr
Once you’ve got an AdSense account and are logged in, click on the AdSense Setup tab to create a new ad for your site.
Select the AdSense for Content link.
Choose if you’d like an Ad unit with text or image ads, or a link unit that only has links to sponsored terms on Google. Ad units are often a good choice for a sidebar, which link units may look better in a header or footer of a theme.
Select the size you want from the drop-down menu beside Format. Pick something that would fit good on your site; if you’re unsure, click the Ad Formats link to see examples.
From the Colors section, select the colors that would match your site, or chose one of the preconfigured Palettes.
Finally choose the font family and size for your ads, and select if you’d like square or rounded corners.
Once you’re finished, click Continue at the bottom.
You’ll now be presented with a textbox showing your AdSense unit’s code. Select the text and copy it, as we’ll need this to add the AdSense to our blog.
Note that you can always access your ad units in the future and edit them from theManage Ads link in AdSense.
Adding AdSense to Your Theme
Now that you’ve got your AdSense code, it’s time to add it to your theme. Browse to the Customize page on Tumblr by clicking Customize in your Tumblr dashboard or by following the link below.
Select the Theme tab in the Customize page,
Scroll down, and then select Use custom HTML at the bottom of the tab.
After the code loads, you should see the HTML and CSS code that makes up your site’s theme. There are endless potentials for customization here, but if you’ve never designed a website from scratch or even edited HTML, it can look intimidating. Don’t worry; it’s easy to add the code!
Note that if you’ve already edited your theme’s code in the past, you may see this by default without having to press the custom HTML button.
You’ll now need to find where to place your AdSense code in your theme. If you’re a website designer, you can look around the code and place it anywhere you want: inside <head>, <body>, or more. If you’ve never used HTML code before, though, there’s another trick you can use. Spot some text near the place on your theme where you want to place your ads. For instance, if you want to place it near on a sidebar under the About this blog description, look at your theme preview to see what default wording it uses. Pick something that’s a title or other default text, as your page description itself will not be in the code.
Now, press Ctrl+F in your browser to open the search dialog, and enter the term you want to find. The search box will look different, depending on your browser, but will work the same.
Look for the highlighted text in your code. We want to post our content right after this section. Note that the next line is still describing the profile, so it goes with the About box still. We’ll want to paste our ad code right after this.
In this theme, we searched for About, and pasted the code right below the code for the about box, just like we showed above.
Once you’ve entered the code, click the Update preview button on the bottom of the tab.
You can now see your changes on the sample blog preview.
If it looks good, click Save in the top right corner, and then visit your site in a different tab or window.
Here’s our AdSense right in my Tumblr sidebar. The colors blend in with my theme, and the ads are at least somewhat related to what I’m writing about.
Remember: Don’t click on your own ads, or your AdSense account may be suspended!
If the ads look too close to the next item in the sidebar, as they did in this theme, you can easily add some space by entering <p> </p> right after your </script>.
This works great on many themes, including the default Redux theme. We added the same ad panel to the sidebar in this theme, and it worked great. No extra spacing required for this theme.
To get the ads where we wanted this time, we opened the code, searched for Follow on Tumblr, and pasted the code right above it as below. This is one of the best ways to get your add right where you want it, even if you’re not a web designer; just find something you want your ads near, search for it, and paste it above. It may take a little trial and error, but you might be surprised how quickly you’ll get the hang of it!
You can even add ads to the footer of your theme. Paste your ad code inside the<footer> of your theme, or if it doesn’t have one, you can just post it right before the</HTML> at the end of the theme code. Here we added the <div id=”footer”> of the Neue theme.
Remember that AdSense allows you to show up to 3 AdSense and 3 link units on a page, but again, Tumblr doesn’t want blogs to be ridiculously covered with advertisements. So, perhaps you may want to put one in your sidebar and one in the footer, or some other configuration that you think looks good and still focuses mainly on your blog’s content. Sometimes less is more; people won’t like your site as much if it’s plastered with ads from top to bottom! Feel free to play with it and get the ads looking great with your theme.
Undoing Mistakes
If you somehow accidently delete something or mess your theme up, you can revert your changes by pressing the Disable custom HTML button on the bottom of the editor window.
Tumblr will remind you that this will remove your theme customizations. Press Ok, and then press Save in the top right corner.
Now your theme will revert to its default settings, and you can come back and try editing the theme again if you want. One thing to note, though, is that changing your theme around may remove some of your customizations such as
Disqus comments. Click the
Appearance tab and make sure all of your settings are correct, or add them back if you need to after restoring your theme.
![sshot-2010-07-20-[12-06-11]](https://lh3.googleusercontent.com/blogger_img_proxy/AEn0k_tuQCao5_MBYL5lfM0OjgQ9VuwYfayZdQgeRB3B4H0knrNMTV9pHZfAWxPsq6ZD9HnHIWYTsb8j8cQGy57ESg1a43rqbCpAc1iyVAOzVfw7fiD-7xuALPf1wi98DTRtKEQc1IbhneYPMqQEUPYz=s0-d)
