布洛格公告
此部落格的開站日期是 2005-7-9 已營運了

發卡布洛內所有文章係採用創用 CC 「姓名標示─禁止改作 2.5 台灣版」授權條款釋出。

經營部落格或許可以為自己增加一些額外的收入,但要是廣告放多了也是蠻惹人嫌的。好啦,這並不是本篇的重點,經營部落格的這兩年來,我發現會點廣告的人就是會去點,不會點的人就算你放再多廣告他也不會點,既然如此,那我們何不讓使用者自行決定要不要在網頁中顯示廣告呢?

  可能會有很多站長認為我瘋了,不過就站在一個網頁瀏覽者的立場來說,比較進階的玩家們不也常常使用adblock、stylish、RIP這類火狐的套件來擋掉某些網站的廣告嗎?我的觀點是,與其讓使用者花心思去擋廣告,我們不如直接做一個廣告開關方便使用者們做切換,要是使用者認為你的網頁內容寫的真的很不錯,我想他們一定也會很高興地點選廣告給你一點鼓勵的。但在這之前,我們還是先還給使用者一個乾淨的瀏覽介面吧!

  本功能使用 jQuery 的 cookie plugins 來紀錄廣告是否顯示的狀態,在公告區塊內加入即可使用:

<script type="text/javascript">
var _ad_div_name="廣告區塊的名稱"; //改這行
jQuery.getScript("http://feka.hostrator.com/js/jquery.cookie.js");
jQuery.getScript("http://feka.hostrator.com/js/self_ad.js");
</script>

※廣告區塊的名稱請自行尋找

1.如果廣告區塊是被<div id="name">廣告內容</div>所包覆,這個區塊的名稱請請寫:#name
2.如果廣告區塊是被<div class="name">廣告內容</div>所包覆,這個區塊的名稱請請寫:.name

如果你是將廣告放置於側邊欄,那通常都是第一種情形。如果你有很多廣告區塊,可以使用逗號將名稱分開,如:.ad1, #ad2, #ad3...

接下來,請在你的CSS中加入以下這段把你的廣告隱藏:

廣告區塊id名稱{display:none}

別擔心,要是網友沒有點選隱藏按鈕,在進入網頁時廣告仍會顯示。

最後,你可以在網頁任何一個位子置入這個隱藏鈕(例如部落格描述)

<input type="button" value="loading ad state..." id="adv_select">

 

Posted by bshadow at 痞客邦 PIXNET Comments(21) Trackback(0) Hits(415)


open trackbacks list Trackbacks (0)

Comments (21)

Post Comment
  • 哇~~

    一點進來這部落格時,看到「我不要看廣告」的按鍵時還覺得很神奇,想來實在是很貼心且用心的一個設置呢。
  • 呵呵謝謝你感受到我的用心 :]

    bshadowreplied on 2009/02/21 19:14

  • 下午有帶語法回去使用
    不過不知道是不是因為我有用側欄收合效果的語法
    導致這個按鈕語法失效了......
  • 應該不是喔,這兩個語法是沒有衝突的 :)

    bshadowreplied on 2009/07/06 08:30

  • 是喔~那我就真的不知道為什麼會失效了 ||| OTZ
    話說....我花了一天的時間套用你現在這個樣式面版作修改,想不到那麼巧來看版主回覆也看到你也用一樣的樣式 (握手) XDD
  • 哈哈,對啊~
    OECSPACE真是個好地方

    bshadowreplied on 2009/07/10 05:47

  • 對啊~我從她那兒學了好多CSS真開心 XDD

    然後我想請教大大您一個問題
    就是文章內那個CODEBOX
    我也想要用那個來作為分享語法的複製框
    (因為我網頁有鎖右鍵,而我看它有複製到剪貼簿的功能剛好是我想要的 XD")

    不知道您的CODEBOX是從哪兒取得的呢?
    是用HTML程式語法寫出來的嗎?
    不好意思唷~因為沒用過跟它很不熟
    所以問題多了點 ||| OTZ ...
  • 那個程式叫做syntaxhighlighter
    設定方法你可以參考這裡:
    http://stonys.pixnet.net/blog/post/24240204

    然後那個複製到剪貼簿的功能
    在firfox下是用flash的漏洞做的
    不過flash在10版以後就修正這個漏洞了
    所以已經不能正常複製了喔
    不過在ie底下應該是ok的

    bshadowreplied on 2009/07/10 18:52

  • 話說我剛剛又試了這個廣告隱藏顯示的按鈕語法
    還是無法使用...

    另外有個疑問就是文內提到要在CSS表內加入
    廣告區塊id名稱{display:none}

    可我發現加入上述CSS語法後整個欄位包括標題都不見了,重點是不管有沒有加CSS那個按鈕按了都沒有效果....

    我好想用這個按鈕語法哦~~真是殘念...
  • 也許你的廣告區塊id名稱寫錯了喔
    你是要隱藏側邊欄位的廣告嗎?

    bshadowreplied on 2009/07/10 18:48

  • 我依照文章內說的id輸入<div class="name">
    原始檔裡面的id
    還是說id的name是要輸入box123456這種呢?

    我想跟你一樣隱藏側邊欄位的廣告
    (不過因為失敗所以把自訂欄位移除了)

    然後我還有疑問就是
    廣告區塊id名稱{display:none}
    id名稱是要設定box123456這種還是name呢?
  • 如果你是將廣告放在側邊欄位中的話,
    那通常都是類似#box123456這種的id~
    像我的blog的廣告區塊是放在側邊欄裡的
    blogAD:#box214124
    bloggerAds:#box389197

    所以我就要在CSS中寫:
    #box214124,#box389197 {display:none}
    將這兩個區塊隱藏起來不做顯示

    然後在程式第一行定義這兩個區塊的id為廣告區塊:
    var _ad_div_name="#box214124,#box389197";

    bshadowreplied on 2009/07/10 23:18

  • 謝謝喔
    我剛剛使用了SyntaxHighlighter
    那篇教學淺顯易懂真是太好了
    比起我昨晚看的WP-CODEBOX容易多的感覺 XD

    不過小蝶(她應該是這樣稱呼吧?@@)分享的語法
    使用後是英文版的,不知道你的中文語系是從哪邊設定或修改的呢?
  • 你可以把他的shCore.js打開修改,
    或是下載使用這支中文化後的程式!
    http://jimsuan.googlepages.com/shCore.js
    把它放在你的網頁空間再作引入就可以了

    bshadowreplied on 2009/07/10 23:06

  • 謝謝版大耐心指導!!
    我成功了!!! (放炮~) Yeah~
  • 不客氣,恭喜歐 :]

    bshadowreplied on 2009/07/11 17:54

  • 囧...我又來打擾了

    我下載了中文化引入使用後
    結果出現亂碼,不是繁體中文
    打開CSS檔案去修改裡面的字型(加入"細明體")
    結果還是一樣亂碼....
    請問該從哪個檔案裡面去修改才能變成中文而不是亂碼呢?
  • 可能是編碼的問題,我已經更新過檔案了,你再試試看。
    還有就是修改時,存檔編碼請選擇UTF-8。

    bshadowreplied on 2009/07/12 14:53

  • 原來如此,謝謝大大 ^^

    另外想再請問一下 (我問題很多對不起...)
    我看您的框內文字都會自動段行不會有文字溢出的問題(也不會出現下捲軸),不知道您是從哪邊修改又是如何修改原始碼才能達到那樣的效果呢?

    我嘗試從SyntaxHighlighter.css這裡面去修改
    試過用OCEPLACE教的word-break: normal;(依照區塊大小強制段行,但不會截斷英文單字)加入SyntaxHighlighter.css檔案裡面,但不知道是我加入的位置不對還是哪裡有問題,一樣沒有效果...
  • 不,其實我也有這個問題 ^^"
    請看這篇:http://bshadow.pixnet.net/blog/post/23126621
    也是一樣會出現下捲軸

    bshadowreplied on 2009/07/12 16:15

  • 真的耶...

    那我再繼續摸索好了 XD
    自學CSS一直遇到瓶頸...唉~(抱怨一下ˊ~ˋ")
  • googlepages掛了
    請問大大有類似googlepages的免費空間可推薦嗎?
  • 我的googlepages還沒掛耶
    不過應該也快了~
    目前我的js都是備份放在這裡:
    http://www.hostrator.com/
    不過他的穩定度絕對不比googlepages啦
    所以要有常常搬家、備份的心理準備喔

    bshadowreplied on 2009/07/12 21:24

  • 謝謝推薦

    不過我還是用了Hinet Myweb(中華電信提供的用戶免費ftp空間)

    目前正在努力將存在googlepages的檔案資料備份當中
    不過檔案實在太多了...好累人喔 囧
  • 救命喔!!!

    大大~~為什麼我的CODEBOX無法觀看原始碼呢?
    點了 觀看原始碼 後 卻只出現以下網址
    http://lafite2230.pixnet.net/blog/post/25298592#
    文章網址後面多了個 # 符號 卻無法像大大的一樣另開啟視窗可觀看原始碼...
  • 我第一次點進去的時候也不行
    但現在又可以了
    我想應該是hinet的空間讀取js檔不穩定的關係
    或是你在網頁還沒完全讀取完之下就點了觀看原始碼
    基本上你的設置是沒有問題的

    0716 更新
    syntaxhighlighter有新版本
    我已在你的留言板中留言了

    bshadowreplied on 2009/07/16 17:04

  • 我也用了此功能~
    不知道我用的對不對(哈)
  • 錯了,因為這兩個檔案根本不存在…
    http://z254453.miroko.tw/js/jquery.cookie.js
    http://z254453.miroko.tw/js/self_ad.js

    bshadowreplied on 2009/07/16 17:01

  • 我想把js檔下載到自己空間
    還是只能用版大的勒??
  • 當然可以放在自己的空間啊
    不過你好像放錯了
    那兩個檔案都連結不到~

    ps
    現在是對了
    不過你顯示ip的超連結結束位置</a>放錯了
    這樣才對:
    <a title="MyIP Service, Get Your IP Address" target="_blank" href="http://myip.easylife.tw"><img border="0" alt="MyIP Service, Get Your IP Address" src="http://myip.easylife.tw/myip.php?c=C0C0C0F0F0F00000009F9F9F"/></a>
    <input type="button" value="loading ad state..." id="adv_select">

    bshadowreplied on 2009/07/16 17:26

  • 嗯...沒關係!!我還是先用版大提供的網址
    這樣應該就ok囉Q口Q" 請版大幫我看看囉~謝謝
  • 嗯嗯,上面的回覆我可能說得太複雜了…
    簡單的說
    <input type="button" value="loading ad state..." id="adv_select">
    這個語法
    要放在</a>的後面
    不然當你點這個按鈕時會跑出顯示ip的那個網址XD

    bshadowreplied on 2009/07/16 17:32

  • 了解~
    整天看語法,真的會被搞到頭大大☉▽☉"
    我已經修改好了!!有問題再來打擾打擾你囉>///<
  • 哈,習慣就好!

    bshadowreplied on 2009/07/16 18:41

  • Private Comment
  • Private Comment
  • Private Comment

Comment Permissions: Allow commenting

Leave Comment

*Name/Nickname
E-mail
Personal Website
Comment Title
*Comment
* Private Comment