Interspire Tutorials - http://www.interspire.com/content
ArticleLive and Google Adsense
http://www.interspire.com/content/articles/31/1/ArticleLive-and-Google-Adsense
By Jordie Bodlay
Published on 01/9/2006
 
ArticleLive and Google Adsense. A match made in heaven? We like to think so. In this article I'll show you how easy it is to get your own money-making content site up in under an hour.

Adding Google Adsense Into ArticleLive
People love free things and as these people learn about the vast resource of endless information that is the internet, they join the millions scouring the web for more and more of the good stuff. As a result, there are more opportunities than ever for anyone -- even you -- to create one of these bastions of facts, figures and general know-how. Now as an intelligent human, I bet you’re thinking: How can I profit from this?  Put simply; ArticleLive is a Content Management System (CMS), and content is the new gold. Adsense uses content to target ads. Ad clicks give you money. Kah-Ching!

So you have ArticleLive (or about to buy it!) and you have your content or idea for the site, but now you aren’t that sure about what to do. Well fear not, for this article will guide you through the steps of not only inserting Google Adsense code into your ArticleLive site, but also optimizing its placement within your site!

Part 1: What is Google Adsense?
If you’re not sure what Google Adsense is or how it will make you money, then here is a rough outline.

Google Adsense is a method of advertising other companies products and services on your own web site. Other webmasters who wish to increase their traffic bid for clicks on related websites. For every click, you get the money that they bid (less Google’s share).

This method is good for two main reasons. First of all, there are no annoying flashing graphics, just simple text links with a small description (which people are more likely to click on, believing them to be normal links and not advertisements). Secondly, and most importantly, the ad's are targeted to the specific page that they are displayed on.

Once you place the ads on your site Google will crawl your site and determine what ads should be displayed on what pages. So if you have an article about how fantastic chess is, then Google will display ad's for websites devoted to chess or sites that sell chess boards. You visitors are thus more likely to click on these ads.
 
Click here for more information about Google Adsense.


Part 2: Getting the Ads
 
Now that you know what Google AdSense is, you just need to sign up for an account; it’s an easy, free process that will have you earning cash in no time! To do that, just visit this sign up page.

Now once you have signed up and are logged in to your Google AdSense account, you will have a number of options at hand. I won’t go into depth on them as Google has a help section here.

Click the “Adsense for Content” link at the top. You will probably want to create a channel (read more here). Make a URL channel for yoursite.com or yoursite.com/articlelive if you have installed ArticleLive in a sub-directory.

Once logged into Google Adsense, select “Ad layout code” from the menu and a page with many options will load up. We now need to decide where we are going to place the ads and what size will suffice. By reading through the Google help information you may stumble across this image:



It is called a “Heat Map” and the darker the colour the better the position for ad placement. Now it is time to generate your first ads, then place them inside ArticleLive.

Part 3: Generating the code
Using the Google "heatmap" image as a guide I have chosen 2 spots to place my ad's. Taking a look at our ArticleLive website, I have marked out 2 positions. (Note: Under Google's Terms of Service, you can only have a maximum of 3 ad blocks per-page)




Why have I chosen these positions? Well, they are both “medium to hot” positions for ads, so we know they are in optimum places. For the ads on the left, I have decided to place them under the category list so that if users are browsing for a category and don’t find one that interests them, they will reach the advertisements and may be inclined to click on them if it shows something interesting. For the center section, I have decided to place the ad code in between the Recent News and Featured Articles as it is then inside the content area and people are less likely to ignore it than if it were at the top.

So now I need to generate 2 sets of Google code; One for the side and another for the centre.
 
For the left side I have chosen these settings in my Google account leaving everything else as is:
  • Ad Layout: Vertical Banner (120 x 240)
  • Color Palette: Mother Earth
  • Channel: myarticlesite.com
The code will now be generated for me in the text box at the bottom. Your code should look something like this:

<script type="text/javascript"><!--
google_ad_client = "pub-0000000000000000";
google_ad_width = 120;
google_ad_height = 240;
google_ad_format = "120x240_as";
google_ad_type = "text_image";
google_ad_channel =" 0000000000";
google_color_border = "336699";
google_color_bg = "FFFFFF";
google_color_link = "0000FF";
google_color_url = "008000";
google_color_text = "000000";
//--></script>
<script type="text/javascript"  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>





Part 4: Inserting the Ads
Now we just need to insert the JavaScript code into our ArticleLive template. There are two ways to do this. One via your control panel, the other via FTP. The file we are going to edit is RootArticleCategoriesPanel.html.
  • To access via your control panel, navigate to Templates > Panel Files > RootArticleCategoriesPanel.html Edit.
  • To access via FTP open /articlelive/template/Default/Panels/RootArticleCategoriesPanel.html in a text editor (like notepad, not MS Word).
The document will contain code similar to this:

<TABLE class="Panel RootArticleCategoriesPanel" id="Table1">
    <tr>
        <td class="Heading">
            %%LNG_hpBrowseCategories%%
        </td>
    </tr>
    <TR>
        <TD style="padding:10px  0px  10px  0px ; ">
            %%GLOBAL_CategoryList%%
        </TD>
    </TR>
</TABLE>


We just want to place our code at the end, so this is a simple process just paste the code on the last line. It may be a good idea to wrap it in <center> and </center> tags. This is what we will end up with (I also added a <br /> to the end to add more spacing):

<TABLE class="Panel RootArticleCategoriesPanel" id="Table1">
    <tr>
        <td class="Heading">
            %%LNG_hpBrowseCategories%%
        </td>
    </tr>
    <TR>
        <TD style="padding:10px  0px  10px  0px ; ">
            %%GLOBAL_CategoryList%%
        </TD>
    </TR>
</TABLE>
<center>
<script type="text/javascript"><!--
google_ad_client = "pub-0000000000000000";
google_ad_width = 120;
google_ad_height = 240;
google_ad_format = "120x240_as";
google_ad_type = "text_image";
google_ad_channel =" 0000000000";
google_color_border = "336699";
google_color_bg = "FFFFFF";
google_color_link = "0000FF";
google_color_url = "008000";
google_color_text = "000000";
//--></script>
<script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</center>
<br />


For the center panel, I used these settings:
  • Ad Type: Ad unit – Text Ads only
  • Ad Layout: Banner (468 x 60)
  • Color Palette: Mother Earth
  • Channel: myarticlesite.com

Now I have my code and need to insert it in between the Recent News and Featured Articles. So we will place it in RecentNewsPanel.html (using one of the methods described above).

Again we will just place it at the end like so:

<div class="Panel RecentNewsPanel" style="display: %%GLOBAL_HideNewsPanel%%">
    <span class="Heading">%%LNG_hpRecentNews%%</span>
    %%GLOBAL_NewsList%%
    <span class="Title">%%GLOBAL_NewsArchiveLink%%</span>
    <br><br>
</div>

<br />
<center>
<script type="text/javascript"><!--
google_ad_client = "pub-0000000000000000";
google_ad_width = 468;
google_ad_height = 60;
google_ad_format = "468x60_as";
google_ad_type = "text";
google_ad_channel =" 0000000000";
google_color_border = "336699";
google_color_bg = "FFFFFF";
google_color_link = "0000FF";
google_color_url = "008000";
google_color_text = "000000";
//--></script>
<script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</center>
<br />


Here is what we have ended up with:



Now that you know how to insert Adsense code into your ArticleLive web site, I'll show you how to insert the code into an actual article.


Part 5: Inserting into Article Template
Our ad's on the left side under the categories will still be displaying when viewing an article but our center one won’t. But that’s a good thing as we are going to insert 2 new ad blocks, as outlined in the screenshot below:



For this I will use a half banner (234x60) at the top and a regular banner (468 x 60) at the bottom. I have generated my code for both of them.

I now need to edit ViewArticlePanel.html (Note: its not a Plural Article) using the same methods as before.

This time in the file we need to find:

%%GLOBAL_ArticleContent%%

I will place one set of ad's above and the other below, so I end up with:

<center>
<script type="text/javascript"><!--
google_ad_client = "pub-0000000000000000";
google_ad_width = 234;
google_ad_height = 60;
google_ad_format = "234x60_as";
google_ad_type = "text";
google_ad_channel ="";
google_color_border = "336699";
google_color_bg = "FFFFFF";
google_color_link = "0000FF";
google_color_url = "008000";
google_color_text = "000000";
//--></script>
<script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</center>
<br />
%%GLOBAL_ArticleContent%%
<br />
<center>
<script type="text/javascript"><!--
google_ad_client = "pub-0000000000000000";
google_ad_width = 468;
google_ad_height = 60;
google_ad_format = "468x60_as";
google_ad_type = "text";
google_ad_channel ="";
google_color_border = "336699";
google_color_bg = "FFFFFF";
google_color_link = "0000FF";
google_color_url = "008000";
google_color_text = "000000";
//--></script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</center>
<br />

This is our result:




The positions of the ad's here is important. They are both warm zones from Google's chart, but there are other motives. Ads at the top are located right where the visitor is most likely to look first on the page therefore catching their eye and their attention. The other ad block I have specifically placed is at the bottom, straight after the article content is finished. My motive here is that once the visitor has read the article they have the topic on their mind and so if they see ad's relating to the topic right after they have finished, they are more inclined to click on them rather than if they were positioned elsewhere.

By now you should be getting a hang of how this whole AdSense and ArticleLive combo works. Remember, to keep a steady inflow of visitors and clicks you will need to constantly keep your website content updated with unique information as search engines tend to reward these types of sites.


Conclusion and Notes
Something to note: If you do insert your code and ad's aren’t showing, don’t be alarmed. Google may need to crawl your site before ad's appear and this could take a couple of days providing you have content on your site.

There are numerous resources all over the net with useful tips on how to optimise your Google Adsense sites. One such site is the Google Adsense Secrets blog with a bunch of useful information such as 13 Ultimate Adsense Tips Collection and 15 Common Mistakes by Google Adsense Publishers that Violate Terms of Service . Then there is always Google's help service or Google's own Adsense Blog.

If you are still wanting more, you can always do a search for "google adsense tips" on google.com.