Adsense, Amazon Within Blog Posts. |
Ever since the debut of the New version of Blogger with the Layout Template, bloggers have been struggling to find ways of inserting Google Adsense and or Amazon Advertisements within blog posts.
The difficulty arose from the fact that most of the advertisements use Javascript code which needs to be pasted within the Blog Posts. In the New Blogger Layouts template Html/Javascript Page Elements were introduced so that Ads. could be put in them. These could then be added to the Header, Footer, Sidebar and the Main Posts column. However, the Blog Posts Page Element being a widget in it's own right does not accept another Html widget inside itself. Check out the Amazon Advertisement to the right --->. I have given it a title : "Amazon Ads." but that can be omitted to make it blend more with your post's content. You can see that it is not a picture/image by hovering your mouse cursor over the links. It will change to a hand icon and the amazon link to the product will be displayed in the status bar of your browser at the bottom.
Thus bloggers were able to add Google Adsense Ads. all round the blog posts and now in between ( Inline Adsense )the posts also. Some hacks were developed to incorporate Adsense within the blog post but most involved modifying the advertisement code which went against the Google Adsense TOS.
Here is a method to incorporate any advertisement within your blog post so as to fully blend in with your content without modifying the code..........GETTING THE CODE
The first step is to get the code from the respective sites. For this login to your Google Adsense or Amazon account and navigate to the code generating section. Customize your advertisement to the size ( It should fit the width of your posts column. )and color you want and copy down the code provided. You can select the channels you want in Adsense and the Advanced Settings tab for Amazon Omakase Ads. allows you to set upto five keywords or phrases to target your Ads.MAKE A GOOGLE GADGET
Paste the code obtained in a new Google Gadget. Follow the same steps as shown in "Increase Traffic | Create a Google Gadget". Load the sample "Hello World" Google Gadget and replace the "Hello World" with the code obtained from Adsense/Amazon. See picture below :
Delete "Hello World" and paste the code instead. Click on picture to enlarge it.
Save the Google Gadget and publish it to get the code. Copy the code for the Google Gadget which you have created.PUT GOOGLE GADGET IN BLOG POSTS
Go to Blogger Home and login to the Blogger Dashboard. Click on 'Posts' link and it will open your list of Blog Posts. Click 'Edit' link next to the post you wish to insert the advertisement in. The post will open in Post Editor. Click on Edit Html tab in the top frame of Post Editor. Paste the Google Gadget code where you want it. If you wish to float it left use the following code :
<span style="float:left;">
GOOGLE GADGET CODE
</span>
To put it to the right of your text use 'right' instead of 'left'. Replace the CAPS with actual code for the Google Gadget. The gadget will not be seen on Preview. Publish the post and click on 'View Blog' to see your Advertisement. Check out my Google Gadget with Amazon Advertisements in this post. To blend it within the post content first make sure that you choose "No borders" while customizing the code for the advertisement in Step 1 above. Then when you generate the code for the Google Gadget you will get something like this :
<script src="http://gmodules.com/ig/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/115706042431009629871/AmazonAd.xml&synd=open&amp;amp;w=305&h=255&title=Amazon+Ads.&border=%23ffffff%7C1px%2C3px+solid+%23999999&output=js"></script>
Change the numbers for the borders to 0 px in the code above to delete the border for the gadget. This will make your advertisement blend in effectively within your posts.ADVANTAGES OF THIS METHOD
1. The advertisement code need not be modified.
2. Advertisements blend in with the posts.
3. You can target each advertisement to the specific content of that post.
4. You can put Google Analytics within the Google Gadget to track it's statistics.
Monetize Your Google Gadget. |
Inspired by the response to Increase Traffic | Create a Google Gadget ( Topping the popularity chart on this blog for the last month ) I researched methods to add advertisements to Google Gadgets.
Here is the method by which you can add any type of advertisement to your Google Gadget. Since you can put a Google Gadget within a post ( in contrast to Blogger Widgets ) this method also allows you to add Google Adsense Ads. within your post as demonstrated here ........
First create your Google Gadget. Looking for content to put in your Google Gadget? I have created one which shows the pictures from my picasa gallery as a sample. You can create a similar one based on your photo album collection. After creating the gadget and adding the Google Adsense or Amazon code as shown below submit it to the Google directory for syndication.
In the below code substitute the items in red with your own code :
1. Change the Module Preferences to those of your own.
2. Change the image URLs' to those from your Picasa gallery album.
3. Change the Amazon Ad. code to your own code.
4. Change the Google Analytics code to your own code.
The code for the Picasa photo albums Google Gadget is shown below :
<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs title="Aishwarya Rai Photos"
title_url="http://betabloggerfordummies.blogspot.com"
author="Vin."
author_email="drbhatns+coolgadget@gmail.com"
author_affiliation="http://betabloggerfordummies.blogspot.com"
category="Fun & Games"
screenshot="http://i52.photobucket.com/albums/g7/vinayak06/ashgadget.jpg"
thumbnail="http://i52.photobucket.com/albums/g7/vinayak06/DummiesGuideBttn120.png"
render_inline="optional"
height="375"
width="175"
description="Aishwarya Rai Photos">
<Require feature="analytics"/>
</ModulePrefs>
<Content type="html">
<![CDATA[
<div id="ashcontainer"
style="text-align:center;">
</div>
<script type="text/javascript">
var counter = 0;
// Preload the images using _IG_GetImage().
var images = new Array();
images[0] = _IG_GetImage("http://lh4.google.com/drbhatns/RuUOIxWr19I/AAAAAAAAAic/xXD5IfB-_LY/s144/ash1.jpg");
images[1] = _IG_GetImage("http://lh4.google.com/drbhatns/RuUOIxWr1-I/AAAAAAAAAik/kYxo3nxP4Vg/s144/ash2.jpg");
images[2] = _IG_GetImage("http://lh4.google.com/drbhatns/RuUOIxWr1_I/AAAAAAAAAis/pL6I66h9h4I/s144/ash3.jpg");
images[3] = _IG_GetImage("http://lh4.google.com/drbhatns/RuUOIxWr2AI/AAAAAAAAAi0/Me2ac0M4gxo/s144/ash4.jpg");
images[4] = _IG_GetImage("http://lh5.google.com/drbhatns/RuUOJBWr2BI/AAAAAAAAAi8/RJXOS6p68ms/s144/ash5.jpg");
// Browse through photos sequentially. When you get to the end of the array, start over.
function browse(){
if (counter == images.length)
{
counter = 0;
}
_gel("ashcontainer").innerHTML = "";
_gel("ashcontainer").appendChild(images[counter]);
counter++;
}
browse();
</script>
<br />
<div style="text-align: center;">
<input type=submit value="Next ->" onClick="browse()">
<br/><br/>
<iframe src="http://rcm.amazon.com/e/cm?t=xxxxxxxxxx-20&o=1&p=21&l=ur1&category=beauty&banner=00AFNRTEE7XXVA2G6TG2&f=ifr" width="125" height="125"
scrolling="no" border="0" marginwidth="0" style="border:none;" frameborder="0"></iframe></div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_IG_Analytics("UA-xxxxxx-xx", "/ash");
</script>
]]>
</Content>
</Module>
Then paste the whole code in Google gadget editor online scratchpad and save it as an xml file. Publish the Google Gadget and get free publicity for your blog.
Lastly in Google Gadget editor go to File--->Publish----->Add to a Webpage. Customize your gadget and click Get Code button. Copy and paste the code in the Edit Html tab of post editor when creating post and Publish.
See my Google gadget with Amazon Ads. on the left side of this post.
Alexa Page Rank for Bloggers. |
Alexa is a website which calculates the traffic your site receives from the number of people who visit it with the Alexa Toolbar installed. The traffic rank is based on three months of aggregated historical traffic data from millions of Alexa Toolbar users and is a combined measure of page views and users. Advertisers use it to determine your site's worth......
Hence if you are looking to monetize your blog you have to increase your Alexa Page Rank so that you can leverage the Ad. market. Alexa is a subsidiary of Amazon.com. To see if you are listed in Alexa Directory go here and paste your link in the text box and click Directory Search. If you are not submit your blog to the Open Directory Project here. You can also search for your blog in Alexa Weblogs.
To see the traffic details for your site go to :
http://www.alexa.com/data/details/traffic_details?url=BLOG URL HERE
Paste your actual blog URL instead of the CAPS.DOWNLOAD ALEXA TOOLBAR
Download the Alexa Toolbar. The Alexa toolbar is a program written by Alexa Internet that users install into the browser. Every time the user changes pages, the Alexa toolbar communicates with Alexa servers to retrieve information which is then displayed in the toolbar. If you are using Internet Explorer, go here and download the Alexa Toolbar. If you’re using Firefox, download the SearchStatus extension which displays the Alexa Rank and Google PageRank. The search Status Extension loads in the bottom right frame of Firefox and you can right click it for more options. The Alexa Toolbar for Internet Explorer is added at the top. See Below :
To increase your Alexa Rank install the toolbar and set your blog as the homepage in your browser.ALEXA TRAFFIC RANK WIDGET
Put a Alexa Traffic Rank widget on your website. For this go to Alexa Site Widgets and choose one of the widgets and paste your blog url and click the Build Widget button. Copy the Html code given. Login to dashboard of blog and click on Layouts. Click Add Page Element and choose Html/Javascript option and paste the Alexa code in contents and save.AMAZON ASSOCIATE SITE REPORT
To get a report on any broken links on your site as well as any out of stock or hard to find Amazon Items visit Amazon Associate Site Report. Paste your site URL and email address and click on Run Report. Alexa will run a program, called a crawler or a robot, which will visit your site and all follow all links on your site, except those that are specifically excluded by your robots.txt file. Alexa will analyze all pages retrieved by the crawl, finding broken links, links to out of stock items and more. Alexa will e-mail the final report to you.
Alexa
Amazon












