廣告單元

如何在網頁中加入動態內廣告程式碼

動態內廣告製作完畢後,下一步便是將程式碼加到資訊提供的 HTML 中。

請務必將動態內廣告程式碼放在資訊提供內,否則可能會導致廣告成效不彰並違反 AdSense 政策。

動態內廣告程式碼的位置

請將動態內廣告程式碼放在資訊提供內容之間,或是開頭/結尾的地方。方法則有兩種,一是直接修改資訊提供的 HTML 程式碼,二是使用外掛程式自動插入程式碼 (如果您使用內容管理系統)。

舉例來說,動態內廣告設定看起來可能會像這樣:

 

內容區塊 1

 

內容區塊 2

 

原生動態內廣告

 

內容區塊 3

 

內容區塊 4

若要在資訊提供內刊登多則廣告,您可以製作多則動態內廣告,也可以多次將同一段動態內廣告程式碼加到資訊提供中。

動態內廣告的置入方式

一般來說,您的內容管理系統會有 1) 一個放有您內容的資料庫,以及 2) 一段透過迴圈放送該內容來建立資訊提供的程式碼。若要查看這段程式碼,只要前往儲存於 CMS 範本資料夾 (有時又稱主題資料夾) 內的範本檔就能找到。

修改範本檔中的程式碼

若要加入動態內廣告,請按照以下方法修改範本檔中的程式碼:

  1. 開啟資訊提供所在網頁的範本檔。
  2. 找出用來建立資訊提供的迴圈 (提示:迴圈程式碼很有可能會包含「while」或「for each」指令)。
  3. 修改迴圈程式碼,以便在資訊提供內插入動態內廣告;明確地說:
    • 如果您的迴圈沒有計數器,請加入一個來設定要插入動態內廣告的頻率。
    • 在迴圈內加入「if」陳述式,使動態內廣告依照您在計數器中定義的頻率顯示。
如需內容管理系統專用的操作說明,建議您使用 Google 搜尋

我們在下方提供了部分虛擬程式碼。您的程式碼結構會與這段虛擬程式碼相似,但實際導入方式有可能會不一樣,端視您使用的程式設計語言而定。

Posts[] posts;
Var count=1; // 如果您的程式碼不含計數器,請定義一個
While (count < posts.length) // 將「count」的值加 1,直到資料庫的最後一篇文章為止
{

   If (count%3=0) //如果「count」的值等於 3 或 6 或 9,則插入廣告
   {
   <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">
   </script>
   <ins class="adsbygoogle" style="display:block"
   data-ad-format="fluid"
   data-ad-client="ca-pub-1234567891234567"
   data-ad-slot="1234567890"></ins>
   <script>
   (adsbygoogle = window.adsbygoogle || []).push({});
   </script>
   }

   <h3>{{ post.title }}</h3> // 所有 count 值都應插入內容區塊標題
   <p>{{ post.body }}<p> //插入內容區塊內文
   <img src="{{ post.thumbnail}}"> //插入內容區塊圖片

}

重要事項

廣告程式碼所在的上層容器 (<div><iframe> 等) 必須具備:

  • 有效的寬度。若將廣告程式碼放在未設定明確寬度的上層容器 (例如浮動元素) 內,廣告就無法顯示。我們會根據上層容器的寬度來計算廣告的寬度。請注意,動態內廣告的最小寬度為 250 像素。
  • 可變的高度。如果廣告程式碼所在的上層容器高度固定,廣告可能會扭曲變形。
這對您有幫助嗎?
我們應如何改進呢?