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.