網誌好讀版: http://weilife.pixnet.net/blog/post/93584311 ------------------------------------------------------------ http://pic.pimg.tw/weilife/1369054468-3135045421.jpg 今天中午午休前照慣例看了一下網誌，結果發現版面整個歪掉了 原來痞客幫的MIB分潤廣告計畫於今日正式上架 其實之前對MIB分潤計畫還滿有興趣的，只是很擔心會破壞部落格版面 原本猜想會像一般放置廣告那樣，在後台可以利用欄位調整廣告的位置 結果痞客幫很賊，直接將廣告置於側邊欄位的最高點，無法於後台更改 這點應該讓部落客們恨的牙癢癢的，雖然廣告可以賺錢沒錯，但還是想保有美麗的版面呀! 更..的是痞客幫還推出了一個去廣告的app，一年要價$600 (這根本是在騙不會CSS的人) 稍稍研究了一下，利用CSS調整了廣告的擺放位置，將小技巧分享給大家 http://pic.pimg.tw/weilife/1369056439-2516096141.jpg 要修改之前要先了解部落格版面的標籤，上圖是一些重要的標籤名稱與配置 - container: 整個部落格內容 - header: 頁首(部落格的橫幅) - content: 文章區 - links: 側欄，作者資訊、最新文章、文章分類等 - footer: 頁尾 痞客幫將MIB廣告放於第一側欄的最頂端，標籤為 #mib-ad-sidebar 有了這個標籤，可以對MIB廣告做許多的事，當然包括隱藏或刪除廣告 * 修改廣告高度 #mib-ad-sidebar{ position: absolute !important; top: 100px; left: 0px; } 將以上語法貼至CSS編輯，可以修改廣告的高度，往下降100像素 若很清楚知道要把廣告放在某個高度，這樣的方法很適合 如果想要將廣告放置所有側邊欄位的下方，此方法變得很不實際 因為側邊欄位的高度可能因發表一篇新的文章而改變 參數改成 top: 0px; left: -200px; 就可以偷偷隱藏廣告啦! * 將所有廣告排排站，擺到網頁的最左方 接下來要介紹的是本篇文章的重點，別怪我沒提醒要看到最後喔 因為廣告繁多，想說乾脆都把廣告擺在一起，全都放到網頁左方一排 可參考文章第一張圖的廣告位置 重點是文章內容與一般側欄仍維持在網頁的正中央 螢幕解析度越高，廣告與文章便會越遠，也就是較不顯眼，版面看起來乾淨許多 不過此方法只適用於一個側邊欄位的版面，雙側邊欄位不適用 (1) 更改側邊欄位設定 至後台側邊欄位設定，將使用的欄位都移至側欄2 側欄1只擺廣告的部分(如BloggerAds)，參考下圖 http://pic.pimg.tw/weilife/1369057298-3235030017.jpg (2) CSS原始碼編輯 這邊的要改的東西比較多，將原本的標籤配置圖改成下圖，共需修改六個標籤的位置 ps. 以下修改依照目前圖中所繪的版面，版面不同的話要請各位想一下再修改喔! 03 * 以下標籤只修改標籤的寬度與位置，只要把這些屬性加進原本的標籤裡，其他的屬性請不要刪除 #container{ width: 100%; /* 將container的寬度調整成100%，讓廣告可以放置最左方 */ } #header, #content, #footer{ left: 50%; /* 方框的左邊對其網頁的中央 */ margin-left: -500px; /* 將方框往左移500像素，因為header+link-row-2總共1000像素 */ z-index: 2; /* 若視窗太小時，廣告與文章區域會重疊，讓廣告不要遮住原本的文章 */ } #links-row-1{ position: absolute; /* 將第一側欄限定絕對位置，網頁左上角 */ left: 0px; /* -200px 的話廣告就不會顯示在網頁上囉!!! */ top: 0px; } #links-row-2{ position: absolute; left: 50% /* 方框的左邊對其網頁的中央 */ margin-left: 200px; /* 將方框往右移200像素， */ } 概念大概就是移動標籤的位置，只要搞清楚 left 與 margin-left 的涵義，就輕而易舉囉! MIB廣告剛好與BloggerAds寬度一樣，擺起來真是整齊!! 昨天觀察的結果，MIB廣告有時候出不太來，拖慢了整個網頁速度，希望痞客幫可以盡快 改善這點 * 大家最關心的xx廣告 剛剛上面有提到怎麼將廣告隱藏，但網頁還是會讀取廣告資訊 只是將廣告放在使用者看不到的地方，一樣會拖慢網頁速度 怎麼將廣告整個拿掉，因為怕寫出來痞客幫會來關切，想知道的請以悄悄話留言 一樣，不適用於雙側欄版面，滿版面OK --

※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 122.116.218.218 回信給你囉:p 痞客幫不讓使用者調整MIB廣告的資訊，所以在後台找不到欄位的 如果只是要隱藏的話，內文有喔~請再找找看 如果要整個拿掉，請到我的痞客幫留悄悄話 痞客幫近期可能還會針對JS破解的方法來進行改版 只要一改標籤此樓上連結的方法便又失效，比較推薦一勞永逸的方法 雖然我的方法痞客邦也可能會破解，但依目前的架構來說是比較推薦的 現在mib廣告都還在測試期間，所以無法知道好不好賺 也就是說現在應該是免費給他掛廣告的 等之後正式上線，後台會有廣告金與成效這些資訊可以看 ※ 編輯: wei76422 來自: 122.116.218.218 (05/24 16:59)