Blogger 電腦版行動版文章中安裝 AdSense 回應式廣告

這次的設置需求是想在 Blogger 文章頁面，標題下方與作者區塊上方加入 AdSense 回應式廣告，文章中段則利用「Blogger 繼續閱讀隱藏廣告和物件」，當在「行動版」或「電腦版」的首頁點擊標題或繼續閱讀超連結時，可以在內文顯示 Google AdSense 廣告。

另外，由於「電腦版」網頁的廣告較大，若在手機上瀏覽自己的「行動版」網頁時，有可能導致廣告超出文章區塊，所以也利用 Google AdSense 提供的「回應式廣告單元設定」，來實現廣告在移動版網頁能夠正常推送。

這篇的廣告放置運用，以多媒體廣告為示範主體， AdSense 的超連結廣告大家可以如法泡製，本文裡就不再多做超連結方面的設置方式了。

由於 Google AdSense 的審查非常嚴謹，一個不小心我們就有可能觸碰到潘朵拉的盒子，好不容易申請的 AdSense 帳號被凍結可不是鬧著玩的。

所以不小心經過這裡看到本篇文章，又剛好有需求在自己的網站上使用本文所做的相關設置的朋友，在做設定前一定要先熟悉「AdSense 條款及細則」與「AdSense 政策與流量品質指南」裡的相關使用規則，才不至讓我們的 Google AdSense 使用權限被凍結！

在瞭解了 AdSense 相關規範後，接著就可以著手規劃廣告要擺放的位置了，目前 AdSense 規定單一頁面可以放置三個多媒體或文字廣告 ( 加起來三個 ) 。

規劃的方向如下圖「( 圖片一 )：橘色框格」為用小工具安裝的廣告、「( 圖片一 )：暗藍色框格」為文章內頁的廣告。圖左為首頁、圖右為文章頁。

( 圖片一 )

在確定廣告的擺放位置之後，會發現 ( 圖片一 ) 文章頁面裡，由上數下來的第一及第二個廣告擺放位置很危險，大致上有兩個問題。

問題一、我們的文章在發表後， Blogger 會抓文章內最頂端的第一張圖片當作首頁的文章圖片 ( 文章標題之下的第一張圖片 ) ，所以，若是將 AdSense 廣告放在文章標題的下方，就會造成圖片與廣告並列，有一定的機率違反 AdSense 政策。

這裡的解決方法有兩種：
a. 使用「選擇喜歡的圖片當作 Blogger 文章縮圖 ( 封面圖 )」及「讓 blogger 首頁顯示等比例縮圖」混合使用，幫文章中的第一張圖片縮放至適宜大小，並將它隱藏只在首頁顯示。
b. 將社群分享按鈕放在廣告和圖片之間，且造成圖片和廣告有一個較大的間隙。
(* 為方便設定，在設置時使用 b. 來做設置 )

問題二、在 ( 圖片一 ) 中的首頁點下標題或繼續閱讀後，會在瀏覽器跳轉到文章內頁時，將隱藏的 read more 區塊中的第二個廣告顯示，所以我們寫文章在下「read more ( 插入繼續閱讀標示 )」時，若在後面直接接著放圖片會造成廣告與圖片並列，有一定的機率違反 AdSense 政策。

解決方法是：
a. 寫完「文摘」在下 read more 時，後面先接一段文字接著再放圖片。
b. 利用 read more 隱藏廣告，並在廣告的下方加入 Facebook 或 Google+ 的粉絲專頁物件。
(* 為方便設定，在設置時使用 b. 來做設置 )

在看完上方說明後，我們觀察一下完成設置後的 Blogger 網頁，無論是使用「桌上型電腦」或是用「手機」瀏覽自己的 Blogger ， AdSense 廣告都可正常推送，且在文章內頁的廣告和圖片都有一段距離，減少了違反 AdSense 政策的機率。

電腦版 ( 桌面模板 ) 的網頁廣告

手機版的網頁廣告

文章更新：

建議可以使用「自適應網站安裝 Google AdSense 回應式廣告，三分鐘搞定！」的設定方式，來佈屬自己部落格內的廣告，設置方式較為方便。

目前 AdSense 廣告政策有做過變更，網頁上單一頁面，已經可以投放三個以上的廣告。由於 AdSense 廣告投放政策可能會隨著時間而有不同。建議每隔一段時間，就要到「AdSense 廣告政策」中觀察實際廣告投放數量的限制，與相關條款。

設置流程

佈署 "手機模板"
找查需要置入廣告代碼的區段
在 Google AdSense 準備六個多媒體回應式廣告
加入回應式廣告
額外的選擇
靈活應用
繼續閱讀，隱藏物件的方法

※ (「Step4.」完成後，所有加入廣告的動作即已完成，若有特殊需求，可試試「Step5.」的額外選擇。「Step6.」是給自己的小課題，對 Blogger 較為熟稔的朋友不妨試試「Step6.」的靈活應用，若成功，打開網站首頁的速度應該會快上不少。)

設置前準備

若對編譯 Blogger 的 HTML 模板還不太熟悉，建議先執行『備份 Blogger 模板 (範本)』的動作，以防原始模板資料遺失。

設定教學

Step1. 佈署 "手機模板"

登入 Blogger 後，前往 Blogger 後台【範本 \ 行動服務】，點選【齒輪】

接著，圈選【是在行動裝置上顯示行動版本】〉【選擇行動範本 \ 自訂】，並按下【儲存】

選擇【範本 \ 編輯 HTML】

在「<head>」下方加入下段程式碼 ( 若模板中有加入過「jquery.min.js」則不需重複安裝 )


<script src='//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'/>

檢查在「<head>」下方是否有下段程式碼 (* 此段程式碼是讓用手機瀏覽我們網站的訪客，能夠看到固定的視窗大小，不使其隨意放大縮小視窗。 )


<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>

Step2. 找查需要置入廣告代碼的區段

在程式碼頁框裡面用滑鼠左鍵點一下，並按下鍵盤組合件【Ctrl + f】 ( 按著 Ctrl 再按一下 f ) ，在出現的「搜尋框」中輸入「<data:post.body/>」按下鍵盤【Enter】

此圖為範本的程式代碼搜尋技巧

此時，在程式碼區間 ( 如果模板沒有改的太亂 . . . ) ，可以找到三處有「<data:post.body/>」的程式碼片段。

第一處「<data:post.body/>」為 "手機模板" 的程式碼，如果模板改的很亂不確定是否為手機段的區間，可以在「<data:post.body/>」上方找尋是否有「<b:includable id='mobile-post' var='post'>」字段，整個 Blogger 模板只會有一處。如下圖

圖:手機模板區間

接著，滑鼠點一下程式碼頁框裡的【搜尋框】，再按下鍵盤上的【Enter】，可以找到另外兩處「<data:post.body/>」"桌面模板" 文章內文區塊的程式碼，如下圖

圖:桌面模板區間

Step3. 在 Google AdSense 準備六個多媒體回應式廣告

在「瀏覽器」開一個新分頁，前往自己的 Google AdSense 頁面，點擊【新增廣告單元】

接著在這裡選擇【回應式廣告單元 ( 測試版 )】

選擇完後，可以看到「這個廣告單元只供採用回應式設計的網站使用」

在這裡我們建立六筆回應式廣告單元 ( 文字和多媒體廣告 )


responsive-home-top
responsive-home-middle
responsive-home-bottom
responsive-post-top
responsive-post-middle
responsive-post-bottom

Step4. 加入回應式廣告

在「Step3.」建立的回應式廣告，點擊取得程式碼，可以在下圖中得到自己的「ad-client」及「ad-slot」數值。在「Step4.」當中只要有「ad-client」及「ad-slot」的部分，都必須改成你自己相對應的數值。

ad-client 為帳號 ID ，ad-slot 為廣告編號

「電腦版」網頁 ( 桌面模板 )，加入回應式廣告單元

在【Step2.】找到要置入按鈕代碼的位置及【Step3.】建置了六筆回應式廣告單元後，接著，【瀏覽器】回到原 Blogger 分頁，可以開始在 "桌面模板" 加入回應式廣告了。

加入以下代碼至【Step2.】圖:桌面模板區間最下面的「<div class='post-footer'>」上方，並將自己對應到「responsive-post-bottom」的 [ ad-client ] 及 [ ad-slot ] 數值做更換


<!-- ads內文回應式廣告js代碼bottom開始 -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- responsive-post-bottom -->
<div id='ads-down' style='width:100%; height:auto; margin-left:0px; padding-top:20px; padding-bottom:20px; position:relative; text-align: center;'>
&lt;script async src=&quot;//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js&quot;&gt;&lt;/script&gt;
<!-- responsive-post-bottom -->
&lt;ins class=&quot;adsbygoogle responsive-post-bottom&quot;
     style=&quot;display:inline-block;&quot;
     data-ad-client=&quot;這裡置入你相對應的ad-client&quot;
     data-ad-slot=&quot;這裡置入你相對應的ad-slot&quot;&gt;&lt;/ins&gt;
&lt;script&gt;
(adsbygoogle = window.adsbygoogle || []).push({});
&lt;/script&gt;
</div>
</b:if>
<!-- ads內文回應式廣告js代碼bottom結束 -->

接著，將以下程式碼更換掉『【Step2.】圖：桌面模板區間』裡的第一個「<data:post.body/>」，並將自己相對應「responsive-post-top」和「responsive-post-middle」裡的 [ ad-client ] 及 [ ad-slot ] 數值作更換。

另外，「 區間」裡的粉絲專頁網址，也請一拼更改為你的 [ 粉絲專頁網址 ]


<!-- ads內文回應式廣告js代碼top開始 -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- responsive-post-top -->
<div id='ads-up' style='width:100%; height:auto; margin-left:0px; position:relative; text-align: center;'>
&lt;script async src=&quot;//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js&quot;&gt;&lt;/script&gt;
<!-- responsive-post-top -->
&lt;ins class=&quot;adsbygoogle responsive-post-top&quot;
     style=&quot;display:inline-block;&quot;
     data-ad-client=&quot;這裡置入你相對應的ad-client&quot;
     data-ad-slot=&quot;這裡置入你相對應的ad-slot&quot;&gt;&lt;/ins&gt;
&lt;script&gt;
(adsbygoogle = window.adsbygoogle || []).push({});
&lt;/script&gt;
</div>
</b:if>
<!-- ads內文回應式廣告js代碼top結束 -->
 
<!-- 桌面內文上部份分享按鈕開始 -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='width:100%; height:auto; margin-left:0px; margin-bottom:30px; margin-top:10px; position:relative; text-align: left;'>
<span>
<!-- Facebook -->
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = &quot;//connect.facebook.net/zh_TW/all.js#xfbml=1&quot;;
fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));
</script>
<div class='fb-like' data-action='recommend' data-colorscheme='light' data-layout='button_count' data-send='false' data-show-faces='false'/>
<!-- Facebook -->
<!-- Google+ -->
<div class='g-plus' data-action='share' data-annotation='bubble'/>
<!-- Google+ -->
<!-- twitter -->
<a class='twitter-share-button' data-lang='zh' href='https://twitter.com/share'>Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;https://platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
<!-- twitter -->
</span>
</div>
</b:if>
<!-- 桌面內文上部份分享按鈕結束 -->
 
        <data:post.body/>
 
<!-- 首頁隱藏繼續閱讀開始 -->
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<div style='display:none;'>
<div id='MBT-google-ad'> 
<br/> 
<center>
 
<!-- 隱藏繼續閱讀js開始 -->
<script type='text/javascript'> 
$(document).ready(function(){ 
$(&#39;a[name=&quot;more&quot;]&#39;).before($(&#39;#MBT-google-ad&#39;).html()); 
$(&#39;#MBT-google-ad&#39;).html(&#39;&#39;); 
}); 
</script>
<!-- 隱藏繼續閱讀js結束 -->
 
<!-- ads內文回應式廣告js代碼middle開始 -->
<!-- responsive-post-middle -->
<div id='ads-center' style='width:100%; height:auto; margin-left:0px; position:relative; text-align: center;'>
&lt;script async src=&quot;//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js&quot;&gt;&lt;/script&gt;
<!-- responsive-post-middle -->
&lt;ins class=&quot;adsbygoogle responsive-post-middle&quot;
     style=&quot;display:inline-block;&quot;
     data-ad-client=&quot;這裡置入你相對應的ad-client&quot;
     data-ad-slot=&quot;這裡置入你相對應的ad-slot&quot;&gt;&lt;/ins&gt;
&lt;script&gt;
(adsbygoogle = window.adsbygoogle || []).push({});
&lt;/script&gt;
<br/>
</div>
<!-- ads內文回應式廣告js代碼middle結束 -->
</center>
<br/>
 
<!-- facebook專頁like按鈕開始 -->
<div style='text-align: center; border:#333333 3px dashed; width:100%; height:auto; margin-left:0px; position:relative;'>
<div class='fb-like' data-action='like' data-href='https://www.facebook.com/techcoke' data-layout='button' data-share='false' data-show-faces='true' data-width='50' style='padding-top:15px; padding-bottom:10px;'/>
</div>
<!-- facebook專頁like按鈕結束 -->
 
<br/>
</div>
</div>
</b:if>
<!-- 首頁隱藏繼續閱讀結束 -->

接著在 HTML 裡搜尋「</head>」，在它的上方加入以下代碼，並按下【儲存範本】


<!-- ads首頁回應式廣告css代碼top開始 -->
<style type='text/css'>
  .responsive-home-top {
    width: 234px;
    height: 60px;
}
@media (min-width:500px) {
  .responsive-home-top {
    width: 320px;
    height: 50px;
  }
}
@media (min-width:800px) {
  .responsive-home-top {
    width: 468px;
    height: 60px;
  }
}
@media (min-width:1100px) {
  .responsive-home-top {
    width: 728px;
    height: 90px;
  }
}
</style>
<!-- ads首頁回應式廣告css代碼top結束 -->
 
<!-- ads首頁回應式廣告css代碼middle開始 -->
<style type='text/css'>
  .responsive-home-middle {
    width: 234px;
    height: 60px;
}
@media (min-width:500px) {
  .responsive-home-middle {
    width: 300px;
    height: 250px;
  }
}
@media (min-width:800px) {
  .responsive-home-middle {
    width: 336px;
    height: 280px;
  }
}
</style>
<!-- ads首頁回應式廣告css代碼middle結束 -->
 
<!-- ads首頁回應式廣告css代碼bottom開始 -->
<style type='text/css'>
  .responsive-home-bottom {
    width: 234px;
    height: 60px;
}
@media (min-width:500px) {
  .responsive-home-bottom {
    width: 320px;
    height: 50px;
  }
}
@media (min-width:800px) {
  .responsive-home-bottom {
    width: 468px;
    height: 60px;
  }
}
@media (min-width:1100px) {
  .responsive-home-bottom {
    width: 728px;
    height: 90px;
  }
}
</style>
<!-- ads首頁回應式廣告css代碼bottom結束 -->
 
<!-- ads內文回應式廣告css代碼top開始 -->
<style type='text/css'>
  .responsive-post-top {
    width: 250px;
    height: 250px;
}
@media (min-width:500px) {
  .responsive-post-top {
    width: 300px;
    height: 250px;
  }
}
@media (min-width:800px) {
  .responsive-post-top {
    width: 336px;
    height: 280px;
  }
}
</style>
<!-- ads內文回應式廣告css代碼top結束 -->
 
<!-- ads內文回應式廣告css代碼middle開始 -->
<style type='text/css'>
  .responsive-post-middle {
    width: 250px;
    height: 250px;
}
@media (min-width:500px) {
  .responsive-post-middle {
    width: 300px;
    height: 250px;
  }
}
@media (min-width:800px) {
  .responsive-post-middle {
    width: 336px;
    height: 280px;
  }
}
</style>
<!-- ads內文回應式廣告css代碼middle結束 -->
 
<!-- ads內文回應式廣告css代碼bottom結束 -->
<style type='text/css'>
  .responsive-post-bottom {
    width: 250px;
    height: 250px;
}
@media (min-width:500px) {
  .responsive-post-bottom {
    width: 300px;
    height: 250px;
  }
}
@media (min-width:800px) {
  .responsive-post-bottom {
    width: 336px;
    height: 280px;
  }
}
</style>
<!-- ads內文回應式廣告css代碼bottom結束 -->

接著，點選左側的版面配置，在下圖的三個位置【新增小工具】新增【HTML/JavaScript】，依序加入標題並增加下面相對應的程式碼。

用「新增小工具」新增「HTML/JavaScript」

新增三個「HTML/JavaScript」

加入標題並增加相對應的程式碼


標題【adsbygoogle responsive-home-top】對應 ->
「<!-- adsbygoogle responsive-home-top --> 區間」

標題【adsbygoogle responsive-home-middle】對應 ->
「<!-- adsbygoogle responsive-home-middle --> 區間」

標題【adsbygoogle responsive-home-bottom】對應 ->
「<!-- adsbygoogle responsive-home-bottom --> 區間」

並將自己對應到 [ ad-client ] 及 [ ad-slot ] 的數值做更換


<!-- adsbygoogle responsive-home-top -->
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- responsive-home-top -->
<ins class="adsbygoogle responsive-home-top"
     style="display:inline-block"
     data-ad-client="這裡置入你相對應的ad-client"
     data-ad-slot="這裡置入你相對應的ad-slot"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<!-- adsbygoogle responsive-home-top -->
 
<!-- adsbygoogle responsive-home-middle -->
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- responsive-home-middle -->
<ins class="adsbygoogle responsive-home-middle"
     style="display:inline-block"
     data-ad-client="這裡置入你相對應的ad-client"
     data-ad-slot="這裡置入你相對應的ad-slot"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<!-- adsbygoogle responsive-home-middle -->
 
<!-- adsbygoogle responsive-home-bottom -->
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- responsive-home-bottom -->
<ins class="adsbygoogle responsive-home-bottom"
     style="display:inline-block"
     data-ad-client="這裡置入你相對應的ad-client"
     data-ad-slot="這裡置入你相對應的ad-slot"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<!-- adsbygoogle responsive-home-bottom -->

接著，前往【範本 \ 編輯HTML】，搜尋「adsbygoogle responsive-home-top」
在「<b:includable id='main'>」的下方加入 [ <b:if cond='data:blog.pageType != "item"'> ]
在「<b:include name='quickedit'/>」的下方加入 [ </b:if> ]

搜尋「adsbygoogle responsive-home-middle」及「adsbygoogle responsive-home-bottom」，一樣的，在「<b:includable id='main'>」的下方加入 [ <b:if cond='data:blog.pageType != "item"'> ] ，
在「<b:include name='quickedit'/>」的下方加入 [ </b:if> ]

在做完上列動作，按下【儲存範本】後，「桌面版」網站回應式廣告即設置完成。

「桌面版」網頁設置說明

常看到的「<b:if cond='data:blog.pageType == "item"'>」其中「 == "item"'> 」，是表示被「<b:if ~ </b:if>」包起來的部份只在文章頁面顯示，若需在除了文章以外的其他頁面都顯示被包起來的內容，可使用「!= "item"'>」。

下面這段 CSS 的意思是，對應到「adsbygoogle responsive-home-top」的 js 廣告，預設廣告寬度為 234px 高度為 60px ( 給手機顯示用 ) ，當網頁寬度大於 500 小於 799px 時，廣告寬度顯示為 320px 高度為 50px ( 給平板顯示用 ) . . . 依此類推。


<style type='text/css'>
  .responsive-home-top {
    width: 234px;
    height: 60px;
}
@media (min-width:500px) {
  .responsive-home-top {
    width: 320px;
    height: 50px;
  }
}
@media (min-width:800px) {
  .responsive-home-top {
    width: 468px;
    height: 60px;
  }
}
</style>

「手機版」網頁，加入回應式廣告單元

前往，【範本 \ 編輯 HTML】，搜尋「adsbygoogle responsive-home-top」並在小工具「<b:widget . . .」上加入 [ mobile='yes' ] ，如下圖

接著再搜尋「adsbygoogle responsive-home-middle」及「adsbygoogle responsive-home-bottom」，同樣的，在小工具「<b:widget . . .」上加入 [ mobile='yes' ]

將以下代碼替換至「Step2.」圖:手機模板區間包含「<data:post.body/>」的整個綠色框框，按下【儲存範本】後，即完成「手機版」的設置。如下圖


     <!-- <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'> -->
       <!-- <data:post.body/> -->
       <!-- <div style='clear: both;'/> --> <!-- clear for photos floats -->
     <!-- </div> -->
 
    <b:if cond='data:blog.metaDescription == &quot;&quot;'>
      <!-- Then use the post body as the schema.org description,
          for good G+/FB snippeting. -->
      <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='description articleBody'>
 
<!-- ads內文回應式廣告js代碼top開始 -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- responsive-post-top -->
<div id='ads-up' style='width:100%; height:auto; margin-left:0px; position:relative; text-align: center;'>
&lt;script async src=&quot;//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js&quot;&gt;&lt;/script&gt;
<!-- responsive-post-top -->
&lt;ins class=&quot;adsbygoogle responsive-post-top&quot;
     style=&quot;display:inline-block;&quot;
     data-ad-client=&quot;這裡置入你相對應的ad-client&quot;
     data-ad-slot=&quot;這裡置入你相對應的ad-slot&quot;&gt;&lt;/ins&gt;
&lt;script&gt;
(adsbygoogle = window.adsbygoogle || []).push({});
&lt;/script&gt;
</div>
</b:if>
<!-- ads內文回應式廣告js代碼top結束 -->
 
<!-- 手機內文上部份分享按鈕開始 -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='width:100%; height:auto; margin-left:0px; margin-bottom:30px; margin-top:10px; position:relative; text-align: left;'>
<span>
<!-- Facebook -->
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = &quot;//connect.facebook.net/zh_TW/all.js#xfbml=1&quot;;
fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));
</script>
<div class='fb-like' data-action='recommend' data-colorscheme='light' data-layout='button_count' data-send='false' data-show-faces='false'/>
<!-- Facebook -->
<!-- Google+ -->
<div class='g-plus' data-action='share' data-annotation='bubble'/>
<!-- Google+ -->
<!-- twitter -->
<a class='twitter-share-button' data-lang='zh' href='https://twitter.com/share'>Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;https://platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
<!-- twitter -->
</span>
</div>
</b:if>
<!-- 手機內文上部份分享按鈕結束 -->
 
        <data:post.body/>
 
<!-- 首頁隱藏繼續閱讀開始 -->
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<div style='display:none;'>
<div id='MBT-google-ad'> 
<br/> 
<center>
 
<!-- 隱藏繼續閱讀js開始 -->
<script type='text/javascript'> 
$(document).ready(function(){ 
$(&#39;a[name=&quot;more&quot;]&#39;).before($(&#39;#MBT-google-ad&#39;).html()); 
$(&#39;#MBT-google-ad&#39;).html(&#39;&#39;); 
}); 
</script>
<!-- 隱藏繼續閱讀js結束 -->
 
<!-- ads內文回應式廣告js代碼middle開始 -->
<!-- responsive-post-middle -->
<div id='ads-center' style='width:100%; height:auto; margin-left:0px; position:relative; text-align: center;'>
&lt;script async src=&quot;//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js&quot;&gt;&lt;/script&gt;
<!-- responsive-post-middle -->
&lt;ins class=&quot;adsbygoogle responsive-post-middle&quot;
     style=&quot;display:inline-block;&quot;
     data-ad-client=&quot;這裡置入你相對應的ad-client&quot;
     data-ad-slot=&quot;這裡置入你相對應的ad-slot&quot;&gt;&lt;/ins&gt;
&lt;script&gt;
(adsbygoogle = window.adsbygoogle || []).push({});
&lt;/script&gt;
<br/>
</div>
<!-- ads內文回應式廣告js代碼middle結束 -->
</center>
<br/>
 
<!-- facebook專頁like按鈕開始 -->
<div style='text-align: center; border:#333333 3px dashed; width:100%; height:auto; margin-left:0px; position:relative;'>
<div class='fb-like' data-action='like' data-href='https://www.facebook.com/techcoke' data-layout='button' data-share='false' data-show-faces='true' data-width='50' style='padding-top:15px; padding-bottom:10px;'/>
</div>
<!-- facebook專頁like按鈕結束 -->
 
<br/>
</div>
</div>
</b:if>
<!-- 首頁隱藏繼續閱讀結束 -->
 
        <div style='clear: both;'/> <!-- clear for photos floats -->
      </div>
    <b:else/>
      <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'>
        <data:post.body/>
        <div style='clear: both;'/> <!-- clear for photos floats -->
      </div>
    </b:if>
 
    <b:if cond='data:post.hasJumpLink'>
      <div class='jump-link'>
        <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
      </div>
    </b:if>
 
<!-- ads內文回應式廣告js代碼bottom開始 -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- responsive-post-bottom -->
<div id='ads-down' style='width:100%; height:auto; margin-left:0px; padding-top:20px; padding-bottom:20px; position:relative; text-align: center;'>
&lt;script async src=&quot;//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js&quot;&gt;&lt;/script&gt;
<!-- responsive-post-bottom -->
&lt;ins class=&quot;adsbygoogle responsive-post-bottom&quot;
     style=&quot;display:inline-block;&quot;
     data-ad-client=&quot;這裡置入你相對應的ad-client&quot;
     data-ad-slot=&quot;這裡置入你相對應的ad-slot&quot;&gt;&lt;/ins&gt;
&lt;script&gt;
(adsbygoogle = window.adsbygoogle || []).push({});
&lt;/script&gt;
</div>
</b:if>
<!-- ads內文回應式廣告js代碼bottom結束 -->

「手機版」網頁設置說明

在「<b:widget . . .」裡加入的 [ mobile='yes' ]，是讓小工具能顯示於「手機版」網站。
替換掉包含「<data:post.body/>」綠色框框區段，則已將它注釋掉，以利方便未來復原。

另外，上面一大串看起來很嚇人，其實只是將「圖：桌面模板文章區間」設置完成的程式碼，整串直接貼在「手機模板文章區」間中。
「margin-top 或 padding-top 之類」相關的數值可依自己的情況做上下的距離調整。

Step5. 額外的選擇

若有額外的需求，只想在文章頁面中利用「繼續閱讀」加入廣告，但在文章頁面的標題下方及作者上方不想放置廣告。也就是說，混合了首頁的上、下小工具建立的廣告至文章頁面。如下圖

( 圖片二 )

只要做兩個動作即可完成：
a. 點選，【範本 \ 編輯 HTML】，搜尋「」及「」，將這兩個區間裡面的程式碼刪除。
b. 搜尋「adsbygoogle responsive-home-top」和「adsbygoogle responsive-home-bottom」，將「<b:if cond='data:blog.pageType != "item"'>」及後方加入的「</b:if>」刪除即可。

Step6. 靈活應用

除了上面「引言中的 ( 圖片一 )」與「Step5. 的 ( 圖片二 )」兩種規劃，也可另外使用下面 ( 圖片三 ) 這種安排，首頁只顯示一篇文章「最新文章」，接著下方的文章利用「標籤調用 js 導出文章及文摘」，若成功，首頁開啟的速度應該可以再加快一些些。

( 圖片三 )

Step7. 繼續閱讀隱藏廣告的方法

可以在「<head>」下方先置入「jquery.min.js」(* 若在模板中有加過「jquery.min.js」則無需再次加入 )
在整個 HTML 搜尋「<data:post.body/>」，找到圖：桌面模板區間的程式碼 ( <b:else/> 之前的那一個 <data:post.body/> ) 如下圖
在「 <data:post.body/> 」的下方加入文章中，【Step4.】裡 --> 【「桌面版」網頁，加入回應式廣告單元】「包含到」的整個區間。如下列程式碼將廣告換成自己的即可看到效果。也可只先放入「FB 或 G+ 專頁按鈕」，檢查物件是否有隱藏。


<!-- 首頁隱藏繼續閱讀開始 -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='display:none;'>
<div id='MBT-google-ad'>
<br/>
<center>
 
<!-- 隱藏繼續閱讀js開始 -->
<script type='text/javascript'>
$(document).ready(function(){
$(&#39;a[name=&quot;more&quot;]&#39;).before($(&#39;#MBT-google-ad&#39;).html());
$(&#39;#MBT-google-ad&#39;).html(&#39;&#39;);
});
</script>
<!-- 隱藏繼續閱讀js結束 -->
 
<!-- ads內文回應式廣告js代碼middle開始 --> <!-- 這裡可更換為自己的AdSense廣告-->
<!-- responsive-post-middle -->
<div id='ads-center' style='width:100%; height:auto; margin-left:0px; position:relative; text-align: center;'>
&lt;script async src=&quot;//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js&quot;&gt;&lt;/script&gt;
<!-- responsive-post-middle -->
&lt;ins class=&quot;adsbygoogle responsive-post-middle&quot;
style=&quot;display:inline-block;&quot;
data-ad-client=&quot;這裡置入你相對應的ad-client&quot;
data-ad-slot=&quot;這裡置入你相對應的ad-slot&quot;&gt;&lt;/ins&gt;
&lt;script&gt;
(adsbygoogle = window.adsbygoogle || []).push({});
&lt;/script&gt;
<br/>
</div>
<!-- ads內文回應式廣告js代碼middle結束 -->
</center>
<br/>
 
<!-- facebook專頁like按鈕開始 --> <!-- 專頁ID更換為自己的 -->
<div style='text-align: center; border:#333333 3px dashed; width:100%; height:auto; margin-left:0px; position:relative;'>
<div class='fb-like' data-action='like' data-href='https://www.facebook.com/techcoke' data-layout='button' data-share='false' data-show-faces='true' data-width='50' style='padding-top:15px; padding-bottom:10px;'/>
</div>
<!-- facebook專頁like按鈕結束 -->
 
<br/>
</div>
</div>
</b:if>
<!-- 首頁隱藏繼續閱讀結束 -->

可以只先放入「FB 或 G+ 專頁按鈕」，看一下物件是否有隱藏。
將包含「 到 」裡面的「」區間刪除，再將「」區間裡面的物件換成自己的即可。

上列程式碼都經過轉換，若你只需要放入普通的 AdSense 廣告，可經由【這裡】轉碼。再將轉換過的程式碼放到「」區間裡面即可。

小結

加入的東西蠻多的，除了建議一定要備份原始模板之外，也可另開一新的網誌試做。
在「Step3.」中的「這個廣告單元只供採用回應式設計的網站使用」，應該是 Google AdSense 擔心使用者裝錯廣告才加入這段提醒事宜 ( 應該不是字面上的意思，可能需要黎清 ) 。

為方便記憶及設定，於「Step3.」中有新增六個回應式廣告。若只是做測試，你可以將自己原本就有的六個廣告單元中「ad-client」和「ad-slot」內的數值，直接替換掉本文中的數值，廣告還是會順利播送，無需再另外新增六個回應式廣告單元。

目前，回應式廣告還有一個小缺點，在訪客使用硬體設備進入自己的網站時，廣告大小就固定住了，若訪客放大或縮小瀏覽器視窗，廣告將不為所動 ( 廣告只會回應訪客在第一次進入網站時，依我們為廣告設定的大小自動調適，除非按 F5 重整網頁 ) 。

最後，在動手做的同時，若有發現程式碼錯誤，無法成功安裝，也歡迎反饋喲！

Google 自訂搜尋嵌入 Blogger 行動版網頁

Blogger 電腦版行動版文章中加入社群分享按鈕

Blogger 放置 Google AdSense 自訂廣告尺寸大小

自適應網站安裝 Google AdSense 回應式廣告，三分鐘搞定！

[教學] Blogger 文章中任意位置加入Google AdSense 廣告

參考文獻

「Add AdSense right After  Tag」

「Introducing custom mobile templates」

「Google AdSense 回應式廣告單元」

「關於回應式廣告單元」

「回應式設計」

留言

Unknown7/22/2015 3:48 下午
nice
thank u
回覆刪除
回覆
Wang Henry娛樂數位5/10/2016 4:16 上午
你好，謝謝你的教學讓我的網站更多元化^^

目前有遇到一個問題還請你幫幫忙@@

測試-網站 https://201605-test2.blogspot.com/

1.電腦版的廣告大小正常、但手機板的卻縮小到螢幕約1/2了，不知道哪裡有式設定錯誤呢?
2.點入文章後只會顯示POST TOP的廣告，其他的POST MIDDLE跟POST BOTTOM都不會出現，這一點也麻煩你提點一下><

PS:我的HOME TOP跟HOME BOTTOM版塊都是放在MAIN區域，且把廣告分別放在上、下，這樣位置是否正確?
還是要另外分在別區域呢?(EX:Cross-Column 2或 FOOTER)

謝謝、麻煩你了~
回覆刪除
回覆
Wang Henry娛樂數位5/10/2016 11:45 下午
你好，目前依照你提供的解決方法做改變，不過目前廣告的部分依舊怪怪的。

狀況為：

電腦版：

僅出現HOME TOP(區塊擺在文章版位的上頭)、HOME MIDDLE只出現兩個(區塊擺在側邊欄位)，不見的廣告為HOME BOTTOM。
文章內，只有POST TOP跟POST BOTTOM，且中間夾了兩個 FB按讚的小按鈕。

手機版：

首頁可以成功出現三個廣告，但典入文章後只有出現兩個廣告，且目前不知道兩個廣告為何會直接排列在文章標題下方(首圖之前、兩個廣告僅以"分享按鈕"區隔)

而你有提到的

script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'/>

插入後反倒會讓電腦版的文章內排版多了兩個FB粉絲團的讚，讓文章的最後一個字距離文章框框底部很遠。
回覆刪除
回覆
Wang Henry娛樂數位5/11/2016 12:54 上午
http://imgur.com/a/qBI0s

直接把他截圖OK嗎?哈

包含了版面擺放配置、HTML5~7小工具的語法~
回覆刪除
回覆
Wang Henry娛樂數位5/11/2016 1:20 上午
都把小工具的 SCRIPT刪除掉了，但HTML7依舊沒有在電腦版的首頁出現。

由於我打HTML7放在最底下，所以首頁下方可以看到HTML7的區塊，但卻是空空的。(點選該區域的右下角的板手設定也可看到語法)

PS：請問你大概幾點要休息? 怕耽誤到你的休息時間~
回覆刪除
回覆
coke5/11/2016 1:32 上午
OK ~ 先醬子，除錯時程總是漫長，其他的另找時間處理吧。晚安 :)
回覆刪除
回覆
Wang Henry娛樂數位5/12/2016 1:12 上午
哈囉，除了上面回應的問題之外，我剛剛自己把HTML7小工具的廣告語法給刪除，並且放入完整的GOOGLE AD語法，結果不論是電腦版、或是手機版的BOTTOM廣告都出現囉!!呼~

現在就只剩下POST內的廣告問題囉~~ 這部分再麻煩一下唷!
原始的AD語法如下，這樣應該沒甚麼重複或是衝突的問題?

!-- 回應3-20160510 -->
「ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-7871587759349123"
data-ad-slot="4309006496"
data-ad-format="auto">-/ins>
script>
(adsbygoogle = window.adsbygoogle || []).push({});
/script>
回覆刪除
回覆
Wang Henry娛樂數位5/12/2016 12:19 下午
謝謝你的回復，也辛苦你了:)

這邊先附上一些圖 http://imgur.com/a/2smbx

是因為我在搜尋「data post body」找到了四個地方XD，而且好像有非常~~一大段有重覆到??對嗎?

(以上都還是在觀察狀況、尚未替換你說的新的廣告語法)

我發現由上到下的六張圖(1925-2218行)順序是 middle->隱藏-->top-->Middle-->bottom~

是不是代表在top前面的「middle-->隱藏」這一大~~段的語法都是重複、且可以刪除的呢?

阿如果可以刪除的話，不知道刪除的範圍要從哪裡開始、哪裡結束呢?

(以上先請問是否可以刪除0.0)

謝謝~
回覆刪除
回覆
Wang Henry娛樂數位5/12/2016 5:09 下午
你好，有關觀念的部分~【data post body/】這邊要怎樣判斷是受機害是電腦版的開始、結束呀(區間)!?

目前的語法中，最上面的【data post body】(第一個)往上看只有TOP 跟 MIDDLE，沒有BOTTOM~

我只動類似這種 COLOR=紅(開始) 「/COLOR(結束) 的邏輯@@
回覆刪除
回覆
Wang Henry娛樂數位5/14/2016 10:23 下午
聽起來就一個頭兩個大了OTZ

如果把測試版的網頁整個的HTML複製貼上到主體網站的話有效果嗎，一直想不透範本的匯入匯出跟HTML複製貼上的差異，哈哈?

或是依照我舊版版型的三個欄位，這樣子會有改善讀取嗎? [側邊攔-文章-側邊攔]

回覆刪除
回覆
Wang Henry娛樂數位5/15/2016 12:13 上午
我找到那個BLOGGERAD了!!(感動) 用CHROME開啟原始碼就可以搜尋到 BLOGGERAD 藏在一篇遊戲APK的文章內~

這樣是否代表我把它放在--設定--文章與留言--文章範本裡面發文的時候也會影響該頁面的讀取速度呢?(即使不是在側邊欄?)
回覆刪除
回覆
Wang Henry娛樂數位5/15/2016 12:42 上午
(PS:最近留言怎麼會先消失一陣子才出現@@)

報告一下，我後來把BLOGGERAD的東西全都撤掉了，包含了文章範本裡面! 目前網站速度正常啦~~哈哈~

現在就剩下了日期沒正常顯示在標題的問題要解決了。

另外有一點比較好奇的，是你的文章內廣告的位置看起來挺平均分散的。

第一個在標題上方、
第二個在首途之後的第七行、
最後才在文章END處，

三個分散得很開~

而我的則是：標題下一則廣告、首圖、間隔兩行字之後立刻接上廣告。(例如：https://goo.gl/86iwkk)

這樣子是需要在範本內做位置的調整嗎?
回覆刪除
回覆
Wang Henry娛樂數位5/15/2016 4:06 下午
謝謝回應，留言板因為找不到可以編輯留言的功能，所以突然想到要留言就只能繼續留言了@@

有關廣告位置的部分，手機板跟電腦版的首頁位置都還蠻滿意的。

就單純覺得電腦版、手機板在文章頁面時TOP跟MIDDLE太接近了，尤其是在滿版的廣告下的比例都很滿，因此有更接近的視覺。

這部分，不知道能否將電腦板POST MIDDLE的部分，擺放側邊欄? (手機板的往中間挪一點?)
回覆刪除
回覆
Wang Henry娛樂數位5/16/2016 2:07 上午
你好，有關文章廣告的部分，剛剛發現了一個怪狀況~

有文章內只出現POST BOTTOM 的廣告，

TOP跟MIDDLE的卻不見了0.0 (連其他分享的小工具也不見)

像這一篇 http://wanghenrytw.blogspot.com/2016/05/GameAPKDownload.html

目前只看到這篇文章出現此狀況~

另外，想請問一下有無可能在範本中刪除掉了一些語法、或是語法跟語法之間的衝突導致BLogspot後台偶爾出現秀逗的狀態?
有時候在變更範本時出現網頁無反應、且必須強制關閉該畫面的狀態，所以在想說有沒有可能因為修改到不該動的範本語法，而導致後台有時候會秀逗。

PS:秀逗的同時，網站運作正常。
PS:有時候明明按了"儲存範本"，但要跳到其他後台功能時卻會顯示"尚未儲存的變更會遺失"的提示。
回覆刪除
回覆
Wang Henry娛樂數位5/16/2016 2:53 下午
你好:)

【問題1】

特定文章廣告呈現異常，這邊你有提到是否有加入/缺少甚麼!

這句話指的是從範本裡面找嗎? 還是該篇文章的HTML找?

這篇文章只有出現post-bottom這個廣告，而top跟middle的廣告消失。

目前我聯想到的就是"文章的HTML"，但這部分比對其他正常的文章後沒有增加/減少的語法。

而整體的範本中的變更不是都是一致性的嗎? 也就是異常的話，會連到全部文章的廣告都異常 <--這是我的想法@@

所以這篇文章是目前發現唯一異常應該是在範本內，但想不出來裡面有跟顛一篇文章相關的語法或是工具@@

【問題2】

你有提到會出現提醒，主要是沒有存檔完畢舊跳去別的後台功能，所以無法正常存檔。

那麼，如果像我現在開啟後台範本時沒有再次跳出該提醒，是否代表這個問題已經被系統自動修復? 謝謝~
回覆刪除
回覆
Wang Henry娛樂數位5/16/2016 3:22 下午
補充：我發現日期消失的原因了!哈哈~

原因是我都忘記了同一天日期的文章只會顯示一次年月日XD

所以才以為是不是我把某個HTML刪除掉，目前看來應該是我誤會了~

這部分先回報給你知道現況:)
回覆刪除
回覆
Wang Henry娛樂數位5/16/2016 4:02 下午
再一次向您回報：

我剛剛直接重新套用範本，但該篇文章廣告依舊異常。所以我接著就把整個部落格的文章全部砍掉，並且重新匯入就正常了。

但後來想到...啊我原本文章的流量計算數據都不見了XD，而且所有文章的自訂網址都變成了預設= =

好慘痛的經驗啊~
回覆刪除
回覆
Wang Henry娛樂數位7/22/2016 5:46 下午
哈囉COKE，好久不見~~

最近廣告都有正常顯示，不過想要問一下手機版內文的廣告有時候會一模一樣(譬如說TOP跟MIDDLE)，這樣是正常的嘛?

另外，總覺得最近解除HOSTED ACCOUNT之後的廣告雖然出現了，但是卻是PIXNET的廣告收益有明顯的成長@@

不知道這部分有怎樣的可能性呢? 我的PIXNET已經沒甚麼更新新的文章了~

是因為我的網域不是https嗎?

謝謝:)
回覆刪除
回覆
Wang Henry娛樂數位7/23/2016 3:01 下午
補充一個問題:)

結構化的錯誤，是否會影響SEO的引擎搜尋? 像是沒有修正的話就會降低排名之類的?

謝謝^^
回覆刪除
回覆
Wang Henry娛樂數位4/12/2017 7:35 下午
哈囉COKE~ 最近在自己嘗試在新的子網域中建立廣告，所以重新來參考這篇教學。

目前在第一步驟的檢查階段時發現了幾個問題想請教，不知道是不是GOOGLE自己從以前到現在有改變基本版型語法的關係?

像是在查詢：

【meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'】

我在全新基本版型的語法中，只有看到【meta expr:content='data:blog.isMobile ? "width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0" : "width=1100"' name='viewport'】

跟COKE文章內提到的語法有些出入，現在的語法開頭則是【meta expr:content='data:blog.isMobile】這兩個是否一樣的意思?或是要多添加一行文章內的語法?

==

另外在步驟2查詢【data:post.body/】的時候也只有兩處、不向文章內提到的三處，也就是說現在的機板版型語法內只搜尋的到手機板x1、電腦版x1。

這樣子不知道在接下來的文章教學，如果繼續照著文章的教學穿插語法的話，不知道會不會有影響廣告的成功?

謝謝
回覆刪除
回覆
Wang Henry娛樂數位4/13/2017 5:42 下午
最新進度回報：

我先把隨意位置的步驟拿掉，改用這篇文章的教學(上中下共六個廣告ID)，目前做完了STEP4，但是在POST的廣告部分似乎顯示上有點問題@@
回覆刪除
回覆
Wang Henry娛樂數位4/13/2017 9:09 下午
Hello COKE,終於搞定了這篇文章的教學STEP4 on 子網域( https://korea3c.wanghenry.com/ )

電腦版、手機板HOME、POST的上中下廣告【應該是】都正常顯示了，這點可否請COKE開起來確認一下?

因為剛做好廣告的時候，手機版-首頁的廣告要不斷地重新整理才會顯示出來，這樣不知道是否為正常現象。

==

另外，【手機版-首頁】廣告的形狀、以及位置方面有點詭異，偏小、也偏左(無置中)、MIDDLE跟BOTTOM重疊在一起(手機畫面下方)。

這個要調整教學內的CSS、還是要怎樣修正他呢?

==

回報一下文章內，圖片410的上面，文章內描述【接著再搜尋「adsbygoogle responsive-home-middle」及「adsbygoogle responsive-home-middle」，同樣的，在小工具「<b:widget . . .」上加入 [ mobile='yes' ]】，第二個middle是不是要打bottom結果筆誤了?

感謝~~
回覆刪除
回覆
Wang Henry娛樂數位4/13/2017 10:50 下午
回報：

上面提到的【手機板首頁廣告的尺寸大小】問題已經解決，

爬文看到之前留言討論中提到可以在：BLOGGER後台-版型-上中下廣告的WIDGET代碼中尺寸的部分改成【style="display:inline-block;width:100%;height:300px;"】，這樣子【手機板-首頁】的廣告尺寸就順眼多了!

只是剩下了【手機板-首頁】的MIDDLE跟BOTTOM還是堆疊在底部，這部分還找不出解決辦法~希望COKE看到後有IDEA可已解決(或是我等一下能自己TRY出方法來XD)

對了，手機板-文章內的廣告似乎不能套用這個方法來改變尺寸，剛剛嘗試著如法炮製一下結果廣告就消失了XD，立刻還原回來!哈哈~【手機板-文章內】這邊是不是因為本篇教學文章內的CSS語法所以不能套用【style="display:inline-block;width:100%;height:300px;"】? 如果是因為這樣子的話，那是不是直接把CSS那段全部OR部分拿掉、接著套用【style="display:inline-block;width:100%;height:300px;"】就可以了?

==

上面留言第一點，還是要麻煩COKE開手機來看看廣告的狀態。一來可麻煩COKE確認顯示是否正常、二來可以看到手機板-首頁底部的廣告堆疊情形。(雖然廣告的SIZE看起來很順眼，但是全部堆在底部好像成效會不彰?)
回覆刪除
回覆
Wang Henry娛樂數位4/14/2017 4:24 下午
哈囉COKE，跟你回報一下新的練習網站的廣告目前都OK了，就文章內的中間廣告不能改100% 300height而已，原因不明XD

同時，我也重新地把主網站按照這個方法重新設定一遍，想嘗試看看能否修復廣告異常的問題，
但是廣告異常的狀態依舊，目前的狀況是：

【已經發布】的文章不論有沒有"手動加入的廣告"，文章內上、中回應式廣告都會消失。

【新發布】的文章，文章內上中下的廣告都正常顯示，同時，在使用Google Publish toolbar檢查廣告位置的時候發現到多了一個middle的廣告在奇怪的位置!!不知道會不會是因為多了這個其外位置的middle，所以造成上述廣告異常的現象?

附圖(imgur網站掛點中，所以用學校的空間傳圖，不知道能否正常顯示-學校網站預設沒有https)
https://www.cc.chu.edu.tw/~b9018002/WHERE.JPG

http://www.cc.chu.edu.tw/~b9018002/WHERE.JPG
回覆刪除
回覆

新增留言

◎ 留言板中提問「代碼」問題，可至『留言代碼轉換器』轉換代碼。

搜尋此網誌

技研可樂