Showing posts with label Making Money. Show all posts
Showing posts with label Making Money. Show all posts

Monday, 11 August 2014

Place Google Adsense Below Post Title in Blogger









I have had a lot of interest in my articles about placement of Google Adsense in a Blogger Blogspot blog. Today I continue the Google Adsense series with an article about how to place your Google Adsense ad unit below the post title in Blogger.

This ad placement requires pasting the Google Adsense code directly into your Blogger template. While not difficult I have rated the skill level as intermediate as it requires parsing (conversion of the Javascript into a format readable by Blogger) of the Google Adsense code first before pasting it into your template. For the benefit of newbies and beginner Bloggers I have broken down the steps to simplify the process and make it more manageable. What follows is a detailed step by step tutorial on how to place Google Adsense below the post title in a Blogger blog including how to create a Google Adsense ad unit if you don't already have one.

Google Adsense Placement Below Blogger Post Title
Steps to Place Google Adsense Below Blogger Post Title
Follow Steps 1-11 if you don't have a Google Adsense ad unit.

IF YOU ALREADY HAVE A GOOGLE ADSENSE UNIT SKIP TO #12

1. From the Blogger Dashboard click on the Google Adsense link at the bottom of the page

2. Proceed to Adsense Setup > Get Ads or sign up for Google Adsense if not already

3. Choose Adsense for Content from the Ad Setup screen

4. Choose Ad unit or Link unit from the Adsense for Content screen. In most cases you will want an ad unit.

5. Choose the Ad Type from the dropdown menu depending on your needs. I often select text only because I think they are better performers but you may have a different experience. Click on the Continue button

6. Choose the Ad Format. Most likely this will be between 336x280, 250x250, or the 468x60 banner sizes.

7. Choose your color palette according to your blog color scheme.
Tip: I find the best way to get the colors for my ads if I am not sure is to create an Adsense unit in Blogger and transfer that color scheme to the new ad unit in Google. Alternatively you can accept the default and change the color scheme later. Changing the color scheme won't affect your ad unit code for your template.

8. Accept the default font in the meantime unless you know the font that you need. You can always check this out later by reviewing your template 

9. Click on the Continue button

10. Create an Ad Channel by clicking the link add a new channel. By default Google will add this to Your Selected Channels. Click on theContinue button

11. You may need to give your ad unit a more detailed name. I recommend keeping the dimensions of the ad unit in the name as it makes the unit easily identifiable. I usually add the name of the blog to the name because I have several blogs. Save and Get Ad Code by clicking on the Submit and Get Code button. 

START HERE IF YOU HAVE A GOOGLE ADSENSE AD UNIT
12. Copy the Adsense code by right clicking the mouse while it is in the code box. Choose select all and then right click again and choose copy. Make sure you get all of the code

Google Adsense Code for ad unit
13. Open the Ad Converter by following this link to Centricle.

14. Paste the Google Adsense code into the converter and press theConvert Ad Code button. This will parse the code so that Blogger will read the Javascript properly. Leave this window open for now as we will be returning here. Note that pasting Google Adsense code in to your Blogger template that has not been parsed will produce errors 

15. Login to Blogger if not already logged in

16. Navigate to Layout > Edit HTML

17. Back up your Template (recommended) by downloading it to your computer

18. Check the Expand Widgets Template checkbox

19. Bring up Blogger Search using CTRL + F. Copy and paste the following line of code into the text box to locate the block of code in your template beginning with this line: 
<b:if cond='data:post.title'>

Code Block to Find
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a> <b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>

20. Return to the Ad Converter and copy the converted code by right clicking your mouse and choosing select all followed by right clicking again to copy it

21. Paste this code directly after the above code block: 

<p>
<!-- Start Google Ad-->
<!-- End Google Ad-->
</p>

22. Paste your Google Adsense ad code between <!-- Start Google Ad --> and <!-- End Google Ad --> 

Add Google Adsense Code to Blogger Template to Make it Appear Below Post Title
23. Click the Save Template button

24. Take a look at your new Google Adsense ad unit in your blog by following the View Blog link. 

Troubleshooting Your New Google Adsense Below the Post Title
  • Note only a placeholder will show up for about the first 10 minutes or so. If no placeholder appears go back and retrace your steps to make sure you haven't forgotten something. Check you have copied the code exactly.
  • If you need more white space between the ad unit and the start of the first line of your article add this html tag <p> before your Google Adsense code and this </p> after the last line of your Google Adsense code
  • If you have Google Adsense ad units in other parts of your blog you will find that only 3 Google Adsense ad units will display on one page at any one time according to Adsense rules. for this reason you may get a placeholder appearing for some of your earlier posts which appear further down the page. To counter this problem I suggest you set the number of posts on a page to 3 if you have no other ad units anywhere else and 2 if you have another unit some where else. Linked units are not included in this only ad units.

In this tutorial I have covered the steps involved in creating a new Google Adsense ad unit at Google Adsense. I have also provided a detailed walkthrough of the steps involved in adding a Google Adsense ad unit below the post title in a Blogger Blogspot blog. Let me know how you get on.

Related Articles
Bloggers Guide to Google Adsense Myths
Add Google Adsense to Blogger Header
Add Google Adsense or Banner Above Blogger Header
Better Placement of Google Adsense in Blogger
Google Adsense Tips for a Blogger Blog
Add a Banner or Google Adsense Above Blogger Header

Blogger Guide to Google Adsense Placement









There are so many places to position Google Adsense in a Blogger Blogspot blog. This article covers the most common places to add Google Adsense ad units and linked units in a Blogger blog together with links to the various articles which explain in detail how to insert the Google Adsense ad unit into Blogger. 

Included in this article about Google Adsense placement are articles that cover positioning in the header both above and below the title, in the sidebar, in the footer, between the posts, between the header and the first post, below the post title, in the middle of posts, between the end of an article but before the embedded comment form

Format of Google Adsense Ad Unit

Google Adsense Ad Units

728x90 Leaderboard
728x90 leaderboard under Blogger header
728x90 leaderboard above Blogger header

160x600 Vertical Wide Banner
160x600 vertical wide banner in sidebar or 120x600 or 120x200

336x280 Large Rectangle
336x280 below post title or 250x250 or 300x250


Google Adsense Linked Units

728x15 Linked Unit
728x15 linked unit in Blogger footer or 468x15
728x15 linked unit in Blogger header or 468x15
728x15 linked unit above Blogger header or 468x15


Placement of Google Adsense on Blogger

EASY - CHANGE SETTING ONLY

Add Google Adsense Between Posts in Blogger
Blogger has a setting which allows you to add Google Adsense between posts. Read more about how to Add Google Adsense Between Posts in Blogger 


EASY - ADD WIDGET ONLY

Add Google Adsense to a Blogger Sidebar
It is extremely easy to add a Google Adsense ad unit to a Blogger sidebar using a HTML/Javascript gadget or widget. For instructions on adding an ad unit to the sidebar please refer to Add Google Adsense to Blogger Sidebar

Add Google Adsense to a Blogger Footer
It is not so popular to place Google Adsense ad units in a Blogger footer however with the increased use of footers as a place that contains valuable information it is becoming more common to place an ad in the footer particularly a linked unit. For instructions on how to place a Google Adsense 728x15 linked unit in the footer refer toAdd Google Adsense to a Blogger Footer


EASY-INTERMEDIATE - MINOR CHANGE TO TEMPLATE CODE AND ADD WIDGET

Add Google Adsense or Banner Above Blogger Header
If you have occasion to display either Google Adsense or an affiliate banner above the Blogger header you can by adding a section to the Blogger template. You can add any kind of Google Adsense content or linked ad unit although I suggest that a 728x90 leaderboard would be ideal for this spot.

Add Google Adsense or Banner Above Blogger Header 

How to Add Google Adsense or a banner above Blogger header

Add Google Adsense to Blogger Header
The header of a Blogger blog is a popular place to add Google Adsense particularly a linked unit. I have good success adding a linked unit below the blog title in the header of my blog.

Add Google Adsense Above the Title

Place Google Adsense Above the Title

Add Google Adsense Below the Title

Place Google Adsense Below the Title in Blogger

Add Google Adsense Between the Header and the First Post in Blogger
Some templates lend themselves well to having a full length banner below the header. The Minima template for example suits a 728x90 Google Adsense unit just below the header and before the first post. Instructions on how to Add Google Adsense Between the Header and the First Post in Blogger

Add Google Adsense Between the Header and the First Post in Blogger

INTERMEDIATE - INSERT GOOGLE ADSENSE CODE INTO TEMPLATE

Add Google Adsense to Body of Post
Positioning Google Adsense within the body of the post in Blogger is a bit more tricky as it requires adding the Google Adsense code to the template. Before adding the code it must be parsed so the Javascript can be read by Blogger

Add Google Adsense Below Post Title

Add Google Adsense Below Post Title

in this article I have pulled together a number of Google Adsense articles I have written in the past about adding Google Adsense to a Blogger Blogspot blog so that it will provide an easy reference for anyone wanting to find out about Google Adsense placing on Blogger.

Related Articles
Bloggers Guide to Google Adsense Myths
Google Adsense Tips for Blogger Blogs
Better Placement of Google Adsense in Blogger
Add Google Adsense to Blogger Header
Add Google Adsense or Banner Above Blogger Header
List of Blog Know How Tutorials for Blogger Blogs

5 Easy Ways to Make Money from Blogger









If you invest a lot of time and effort in your blog you probably want to monetize your Blogger Blogspot blog to reap some financial reward for all that hard work. In this article I explore 5 easy ways to make money from Blogger so that your blog will pay its way.

1. Advertising Programs

Google Adsense
Google Adsense is probably the best known advertising program available to Blogger webmasters since Google Adsense can easily be inserted into your blog with a couple of clicks. Google Adsense is a good choice if you are starting out and want to earn a bit of extra cash. Don't expect too much at first though or you may be very disappointed. In my experience you will probably only get about 1 click for every 200-300 impressions. Therefore you will need plenty of traffic to make Google Adsense work for you. See my tips on building site traffic if this is an area you would like to develop on your Blogger blog. For more about Google Adsense please refer to Blogger Guide to Google Adsense Myths and Blogger Guide to Google Adsense Placement

You can also add Google Adsense to your Blogger feeds giving you additional advertising opportunities. If you haven't burnt your blog's feed at Feedburner make it a priority. That way you can have Google advertising appearing in all your feeds. Please refer to my tutorials onHow to Burn a Blogger feed at Feedburner and Blogger RSS Feeds and Feedburner for help on this subject.

Other Advertising Programs/Networks
There are plenty of other advertising programs to choose from if you decide against Google Adsense. Adbrite is worth considering if you are in the market for an alternative to Google Adsense. Another alternative worthy of consideration is Widget Bucks as they claim a higher CPM than Google Adsense. Linkworth offer a range of publisher choices to fit your blog and also have a generous referral program. Yet another possibility and one which I am using on my blog right now is to try out Chitika which allows you to insert ad units along with Google Adsense or Adbrite offerring even greater advertising opportunities for your Blogger blog


2. Affiliate Marketing
Affiliate Programs are free. They provide banners you can place on your blog which when clicked on earn you revenue. Typically these programs either give you a percentage of the sale eg 5-10% or they pay a set commission per lead. Some of the largest affiliate programs are Commission Junction and LinkShare.com. Most have a referral program too whereby you can earn revenue by referring other publishers and advertisers. For example Linkshare pays $1.50 for every valid publisher (afffiliate sometimes called vendor) signup who generates a click-through to Linkshare within 30 days.


With so many good merchant programs to choose from it is easy to go a bit overboard on banner advertising. Be careful not to overuse banners as they can detract from the look and feel of your website.

3. Place a Donation Link or Button on Your Blog
Donations can bring in a few dollars depending on the generosity of your visitors and the quality of your blog. You may have seen that a number of Blogger bloggers have a donation link or button on their blog. These are equivalent to a tip jar on a counter. If a visitor particularly likes your blog or has benefited from your help in some way they may be only too happy to slip you a couple of bucks. Offerring a Paypal link on your blog is an easy and straightforward method for visitors to make a donation large or small. See my step by step Blogger tutorial on How to Add a Paypal Donate Button to Blogger

4. Sell E-Books or other Digital Media on Your Blog
One sure fired way to increase site traffic is to offer some digital product on your site that visitors are prepared to pay for. There are heaps of examples of Bloggers who have made a good return using this method such as Yaro Starak's Blog Mastermind, Rob Benwell'sBlogging to the Bank 3.0 and Atomic Blogging by Alvin Phang.

5. Sell Advertising Space on Your Blog
If your blog is moderately successful in terms of the volume of traffic it receives you might consider selling advertising space to a company for its advertising campaign. The advertising slot can be leased on an ongoing basis or is good for a given number of impressions.

In this article I have discussed 5 easy ways to make Blogger blog pay its way. Do yourself a favor and start earning some revenue today.

Related Articles
Bloggers Guide to Google Adsense Myths
Google Adsense Tips for Blogger Blogs
Better Placement of Google Adsense in Blogger
Add Google Adsense to Blogger Header
Blogger Guide to Google Adsense Placement


Make Money Add Banners Ads to Blogger
Add an Affiliate Banner to Blogger Sidebar

List of Blog Know How Tutorials for Blogger Blogs

Add an Affiliate Banner to a Blogger Header






If your intention is to make money from your blog chances are you will want to add an affiliate marketing banner to your Blogger Blogspot header. Doubtless you have seen plenty of websites sporting advertising banners which are creating revenue for the author by way of banner clicks. With a small amount of tweaking to your Blogger template you too will be in a position to boost the revenue earning capacity of your Blogger blog.

Add a Banner to Blogger Header - Sand Dollar Header with Affiliate Banner Ad
Add an Affiliate Banner to Blogger Header
There are a variety of good places for a banner but the header of a blog is by far the most prominent area. Unfortunately Blogger does not have an easy facility for inserting an advertising banner into your Blogger header. To manage this issue you have two choices:
1. Use a custom template that comes banner ready. (There are a number of templates out there with this feature built-in)

2. Or customize your existing standard Blogger template.

This article focuses on choice 2 - how to go about manually editing your template to add an affiliate banner ad. By the end of this tutorial you will have the necessary knowledge and know how to insert a banner into the header of your Blogger blog. The level of difficulty for the additions I am proposing I have rated as easy to intermediate. You will be adding a snippet of code to your template plus pasting in the affiliate marketing banner code

For the purposes of this example I will be using a 468x60 banner. I have tested this method of banner insertion on the following standard Blogger templates: 
Herbert
Rounders
Denim
Thisaway
Son of Moto
Sand Dollar

It will also work on custom templates that don't already come with an advertising banner in the header built in.


How to Insert an Affliate Marketing Banner into a Blogger Blog

1. Login to Blogger.com and navigate to Layout > Edit HTML page of your blog

2. On the Edit HTML page you will see the option to back up your template by downloading it to your system. I strongly advise that you take this opportunity to backup as you are about to make a change to your template where if something goes wrong you may not be able to restore it.

3. Once you have backed up your template place a check in theExpand Widget Templates box 

4. Search your template and locate the following lines of code within the header section of the template:(note you can search by using CTRL + F and entering <b:includable id='main'> into the search box
<b:includable id='main'>
<b:if cond='data:useImage'>

5. Now insert the following 2 lines of code directly below <b:includable id='main'> and before <b:if cond='data:useImage'>
<div class='ads'>
</div>

6. Place your merchant affiliate code between the lines of code you just inserted. You will need to copy the code from the affiliate program provider to your template. If you are yet to sign up for an advertising program such as Linkshare you will need to do so before you proceed. Alternatively you could use my banner code in the meantime to test this banner and later substitute it for your own.
<div class='ads'>PLACE YOUR BANNER CODE HERE
</div>

LinkShare_125x125ButtonV2

7. Review the code you have entered. If you have followed the steps above you will now have code that resembles this. (Your affiliate code will of course be different):
<b:includable id='main'>
<div class='ads'>

<a href='http://www.linkworth.com?a=23734' target='_blank'><img align='right' border='0' height='60' src='http://www.linkworth.com/adm/affiliate_manager/affiliate_banners/bann-36.gif' width='468'/></a>

</div>
<b:if cond='data:useImage'>

8. When you are sure you have correctly inserted the code into the template scroll up until you find this line in your template ]]></b:skin>

9. Immediately before this line add the following lines:

/* Header Banner
----------------------------------------------- */
#header .ads{width:480px; height:80px; float:right; padding:20px 0px 0px 0px}

10. Click on Save Template

11. Click on View Blog to view your new banner.


Troubleshooting
  • If you need to change the alignment or padding around the banner to your own specifications you will need to change the CSS stylesheet code entered in Step 9 
  • You can change the alignment of the banner by changingfloat:right; to float:left; if you would like your banner to left align. 
  • If you change your template for another standard Blogger template you may need to re-enter the code in Step 9.

In this tutorial you have learned to how to insert a 468x60 affiliate marketing banner into the header of your Blogger Blogspot blog and will now be on your way to earning revenue from multiple income streams. Well done!!!


Related Articles
List of Blog Know How Tutorials for Blogger Blogs
5 Easy Ways to Make Money from Blogger
Make Money Add Banner Ads to Blogger
Add an Affiliate Banner to a Blogger Sidebar
Add Google Adsense or Banner Above Blogger Header