每篇文章自動加入Adsense廣告 @ 夢想の遠方

最近一連串修改Blog內的CSS版面問題，還有突然想到是否能加入Google Adsense在每篇文章底下。

Google搜尋一下總有辦法能解決，先來說說加入Adsense於每篇文章底下的方法，一位部落客Nelson寫了一篇「讓每篇文章自動加入 Google AdSense (適用於 Pixnet / 天空 / 樂多 / 新浪 / Xuite)」，甚至還很好心的提供js檔案連結及下載，而且統合了這麼多的Blog空間都能適用，真是非常的棒!但這篇文章是2008年的，所以我用了他的方法卻沒有任何效果!?(原來經過Pixnet後來的改版已經不適用)

接著我爬著他的訪客迴響，發現有一位更好心的部落客dragonspring，修改了Nelson的程式碼再加以方便化「2011:為每頁自動加入Adsense廣告（附程式碼產生器）」，只要在他Blog上的輸入框內貼上對應的文字和Adsense程式碼就可以產出部落格描述+Adsense整合起來的程式碼，再來複製貼到自己部落格描述上即可，多方便!

但我想要放在側邊攔裡行不行?可!
其實只要把部落格描述那段文字刪除掉就可以直接放在側邊欄自訂的位置裡，而我就是這麼做。

<div id="divAdSenseContentScript" style="display:none;">
<br />
這裡放您的Google Adsense程式碼
<br />
</div>
<script type="text/javascript">
/*
* 檢查網址裡頭有沒有 "/post/" 字串，
* 有的話就代表是單篇文章。
*/    
var isArticle = false;
if (document.URL.indexOf("/post/") > 0)
isArticle = true;

if (isArticle)
{
    if (document.addEventListener)
        document.addEventListener('DOMContentLoaded', init, false);
    else
        window.attachEvent('onload', init);
}

function grey()
{
    // "Content" 是文章的主要區塊
    var CONTENT = document.getElementById("Content");
    var DIVs = CONTENT.getElementsByTagName('div');
    for (var i in DIVs)
    {
        var x = new String(DIVs[i].className);
        if (x.indexOf("extended") == 0 || x.indexOf("footer") == 0)
        {
                DIVs[i].innerHTML =
                      document.getElementById("divAdSenseContentScript").innerHTML
                      + DIVs[i].innerHTML;
            break;
        }
    }
}

function grey2()
{
    var DIVs = document.getElementsByTagName('div');
    for (var i in DIVs)
    {
        var x = new String(DIVs[i].className);
        if (x.indexOf("mainEntryfoot") == 0)
        {
                DIVs[i].innerHTML =
                      document.getElementById("divAdSenseContentScript").innerHTML
                      + DIVs[i].innerHTML;
            break;
        }
    }
}

function roodo()
{
    var DIVs = document.getElementsByTagName('div');
    for (var i in DIVs)
    {
        var x = new String(DIVs[i].className);
        // 檢查 class 是否為 "posted"，是的話就是文章結尾
        if (x.indexOf("posted") == 0)
        {
                DIVs[i].innerHTML +=
                      document.getElementById("divAdSenseContentScript").innerHTML;
            break;
        }
    }
}

function wretch()
{
    // "Content" 是文章的主要區塊
    var CONTENT = document.getElementById("content");
    var DIVs = CONTENT.getElementsByTagName('div');
    for (var i in DIVs)
    {
        var x = new String(DIVs[i].className);
        // 檢查 class 是否為 "innertext"，是的話就是文章本體
        if (x.indexOf("innertext") == 0)
        {
                DIVs[i].innerHTML +=
                      document.getElementById("divAdSenseContentScript").innerHTML;
            break;
        }
    }
}

function template()
{
    // "Content" 是文章的主要區塊
    var CONTENT = document.getElementById("article-box");
    var DIVs = CONTENT.getElementsByTagName('div');
    for (var i in DIVs)
    {
        var x = new String(DIVs[i].className);

     // 將 google adsense 程式碼加在 "article-content" 的前後
        if (x.indexOf("article-content") == 0)
        {
                DIVs[i].innerHTML =
                      DIVs[i].innerHTML 
                      + document.getElementById("divAdSenseContentScript").innerHTML;
            break;
        }
    }
}

function init()
{
    var LINKs = document.getElementsByTagName('link');
    for (i = 0; i < LINKs.length; i++)
    {
        if (LINKs[i].getAttribute('rel') == "stylesheet")
        {
            var style = LINKs[i].getAttribute('title');
            // 根據 stylesheet 的 title 屬性來分辨是哪種版型
            switch (style)
            {
                case 'grey':
                    grey();        break;
                case 'grey2':
                    grey2();    break;
                case 'yam':
                    roodo();    break;
                case 'wretch':
                    wretch();    break;
                default:
                    template(); break;
            }
            break;
        }
    }
}
</script>

原本dragonspring提供的程式碼，廣告會在文章的上、下都顯示，但我只要下面顯示而已，所以以上的程式碼我更改過只有下面會顯示。欲修改的話請看以下說明：

code.1 (這段在"// 將 google adsense 程式碼加在 "article-content" 的前後"的下面)

DIVs[i].innerHTML =
DIVs[i].innerHTML 
+ document.getElementById("divAdSenseContentScript").innerHTML;

如果想要上、下都顯示請將 code.1 改成：

DIVs[i].innerHTML =
document.getElementById("divAdSenseContentScript").innerHTML 
+ DIVs[i].innerHTML 
+ document.getElementById("divAdSenseContentScript").innerHTML;

如果只想顯示上方的話，請將 code.1 改成：

DIVs[i].innerHTML =
document.getElementById("divAdSenseContentScript").innerHTML
+ DIVs[i].innerHTML;

如果想要上、下方顯示不同的廣告(上文字+下圖片)，須增加一組div且取不同的ID名稱，請更改最上面：

<div id="divAdSenseContentScript" style="display:none;">
<br />
這裡放您的Google Adsense程式碼
<br />
</div>

改成

<div id="divAdSenseContentScriptHead" style="display:none;">
<br />
這裡放您的Google Adsense程式碼
<br />
</div>
<div id="divAdSenseContentScriptTail" style="display:none;">
<br />
這裡放您的Google Adsense程式碼
<br />
</div>

再把 code.1 改成

DIVs[i].innerHTML =
document.getElementById("divAdSenseContentScriptHead").innerHTML 
+ DIVs[i].innerHTML 
+ "<br />"
+ document.getElementById("divAdSenseContentScriptTail").innerHTML;

以上程式碼皆由dragonspring內的文章、迴響爬取，經過整理與小修改，如果有其他需求或問題請找原作者，因為我對程式語言不懂，所以無法解決其他的問題。