隔了一段時間,終於有空整理一下噗浪單則訊息頁面的問題。
噗浪將單則訊息頁面改版已經有好一陣子了,在上方增加了一個橫幅放廣告,原本置中的回應區放到左側,讓右側多出空間來放其他資訊與廣告欄位。
因為我用火狐,並有安裝 Adblock 外掛,所以預設看到的頁面會是這樣:
會自動擋掉有廣告的部份。
如使用Chrome並且沒有安裝擋廣告的外掛,則會呈現這樣:
上方的橫幅與右側的廣告,可能會干擾到訊息本身的閱讀,如果有自訂的噗版樣式,多出來的區塊則會突兀的橫在那邊,導致版面不協調。
我們可以使用自訂語法將原本的噗浪單則訊息頁面調回來,修正成原來的樣子。
用火狐看:
用Chrome看:
語法:
/*拿掉突兀的頁首與右側欄位*/
#plurker_info section, #top_header { display : none !important; }
/*拿掉噗浪生物*/
#timeline_holder #creature { display : none !important; }
/*調整回應列表寬度並置中*/
#plurk_responses,
#reply .responses li article .message
{
max-width: 960px !important;
float : none !important;
}
如果原本使用的自訂佈景裡,浪上的噗訊息有特殊的指定底色或文字顏色,像是黑底白字,也可以使用語法來做適當調整:
語法:
/*訊息底色字色與框線調整*/
#timeline_holder .bigplurk .content, #vert_timeline .bigplurk .content
{
border: 0 !important;
color: #eee !important;
padding: 5px;
background-color: #000; /*底色*/
border-radius: 4px; /*圓角*/
}
/*調整頭貼大小*/
#timeline_holder .bigplurk .content .avatar img, #vert_timeline .bigplurk .content .avatar img { width: 40px; height: 40px; }
下方的回應區也可以相應的調整顏色:
語法:
/*回應區底色字色與框線調整*/
#response_number h2 a, #plurk_responses div.feed-link a { background: none !important; }
#plurk_responses ul.responses
{
background: #000 !important;
border: 0 !important;
}
#plurk_responses ul.responses li
{
background: #fff !important;
border: 0 !important;
}
/*輸入區底色字色與框線調整*/
.plurkaction
{
background: #000 !important;
border: 0 !important;
}
如果希望保留左右側的排列,讓按讚分享的噗友資訊能顯示出來,也可以只改變外框顏色:
語法:
/*調整右側資訊與回應欄位底色框線*/
#plurker_info section, #plurk_responses ul.responses, .plurkaction
{
background: #000 !important;
border: 0 !important;
}
動手嘗試看看吧!讓單則訊息頁面也能改成適合自己的噗版樣子~
補充:
想要保留右側欄位,但須隱藏廣告,可以使用這個語法~
/*只拿掉廣告,保留上方與右方欄位排列*/
.adsense { display : none !important; }
留言列表