v Blogger template模板教學課程---如何修改有廣告的模板 >> 0 與 1 謎詭世界
★★★請勿任意轉載本站的文章及圖片但歡迎網摘及連結並註明網站名稱與網址,勿全文轉載,彼此尊重,
是網路的基本禮儀。


>
2013 曬書節 - 萬種商品49元起!

2008年8月31日 星期日

Blogger template模板教學課程---如何修改有廣告的模板


綸太郎以實例來教各位如何修改模板,其實這是針對想要放廣告欄位(Ads)或是多重欄位的較複雜性的模板來說明,因為很多時候簡單的模板只要套用,最多改個標題圖片或是寬度就可完成了,但是想要一個功能性模版,有礙於裡面有廣告自己不會刪,怎麼辦呢?

我以目前很流行的PassionDuo模版來說明,有三個地方有廣告:
PassionDuo Blue, Red & Green Templates
1、標頭右邊有個468*60的廣告
2、文章最上方也有468*60的廣告
3、邊欄右手邊有6個125*125的方形廣告
下方還有個搜尋框

通常設計者在設計時都會以 <!--說明文字 --> 來註解,這部份並不會顯示在網頁上,只是做參考用的,以這個模版他就有寫出來,
<!-- Replace with your ads --> 告訴你可以置換這個廣告,如果我們對英文說明不是很了解,你可以下載模版後,滑鼠放在某個廣告上,然後按右鍵在圖片廣告上,選擇屬性(FF)或是內容(IE),知道這張圖片的網址或是連結的url位置,然後複製下來,


比如有一個廣告的位置是指向http://www.linkworth.com/?a=10230
然後我們進入後台,版面配置→修改html→展開小裝置範本,找尋這串文字,就可以找到他的位置,再將你想指向的圖片及網址置換上去,或是直接將此段語法刪除,但要記得,上次我們有提到每個區塊都會以div框住,所以如果你要直接刪除的話,就要把<div>到</div>這段語法都刪除。


以這個模版來說右邊廣告125*125圖片區,這段的語法就是在<div class="ads-sidebar">到</div>這部份,你可以加入你自己的圖案廣告(例如Bloggerads125*125的廣告)或是連結,語法如下
<a href="要指向的網址"><img src="圖片網址" /></a>
當然這段語法在上方CSS,也是有定義的,在這行及下方
.ads-sidebar{float:left; margin:0pt; padding:0pt}
通常如果你要整個區塊刪除,建議連CSS定義也可以刪除,因為用不到,也可簡化檔案,但初學者不太熟悉語法者,保留也無所謂,免得刪錯了。

但如果是放Google AdSense呢?沒有圖片網址,沒關係,AdSense的程式碼變數都一樣,你就找到google_ad這段文字即可,一樣把它換成你的廣告程式碼或是整個刪除,若是要換程式碼,記得 <>都要改成&lt;及&gt;,但綸太郎建議還是用新增小工具html程式碼,放AdSense廣告較好,修改置換廣告也比較方便,不用修改原始程式碼,當然這區塊你也可以加上你想加的圖片連結或是其他元素。
所以這樣是不是很簡單,刪除廣告,也能自行加入自己想要的連結圖片,其實沒有很困難的,有時你也可以看看是不是有隱藏的廣告放在你的模版裡,通常用ads三個英文字做搜尋或是查看html有沒有可疑的網址連結,就可以察覺了。

最下方有個Search搜尋框,通常有裝Google AdSense的格主會刪除,使用自己的AdSense Search搜尋框,如果不想使用模版設計的,用”search”為關鍵字尋找,記得前後不能有空格,找到html語法裡有相關的,例如這裡的就是<div class="search">也是把這段區塊語法刪除即可,不過綸太郎還是建議以新增小工具的方式來新增Search Box,而不是直接加在語法裡。

這個模版還蠻實用的,有導覽條,通常CSS裡會定義為Menu或是Tabs,在這裡是定義為TopMenu,如果你想像綸太郎的部落格有分頁導覽,你可以使用這個模版,直接在網頁元素裡的Top Tabs加入你的網址即可。

如果覺得這個模版適合你的需求,可以到
PassionDuo Blue, Red & Green Templates下載,有藍色、紅色及綠色三款。

4 則留言 :

  1. 以這個模板來說,Search Bar也是廣告嗎?

    回覆刪除
  2. 一般模版的search bar應該沒有廣告,這部分我沒有深入研究,只是以我的習慣會換上我自己有廣告的搜尋列。

    回覆刪除
  3. 最上面的banner在哪里修改呢

    回覆刪除
  4. 找到這個 #header-inner或是#header-wrapper{
    這兩個應該都可以改

    回覆刪除

設有留言驗證及核准,版主閱覽後,留言才會顯示,發問前請善用網站目錄Google搜尋功能

Related Posts Plugin for WordPress, Blogger...