霝兒小教學_套用部落版面 需注意事項(請自行檢查)

 

 

朋友問我 為什麼套用霝兒版面後 會出現不如預期效果

我將此問題一一彙整 一併回答

目前經測試 發現有下列幾項問題 皆可能導致版面跑版變形

甚或其他不可預期的狀況產生

痞客邦的版面套用 似乎沒像阿虎這麼簡易方便

需注意下列幾項設定 煩請格友們自行檢查

(一)

解除不必要的App裝載

至後台查看 App是否有太多不必要的加載

若有 請解除設定或停用 只留幾項可用掛載即可

以霝兒本身設定為例 目前也才安裝4項App(各位可自行斟酌解除或安裝)

(二)

公告版位內容設定

文字前若用語法 記得最後也要用語法結束

(三)

檢查自訂樣式進階版設定

通通設為不修改 背景顏色清除

修改後記得按儲存

 

(四) 

側邊欄位設定

此設定關乎三種版面套用是否平衡美觀

請務必做調整

(五)

部落格描述設定

部落版頭描述若想擺放如此整齊 段落分明

像這樣 ↓

請參考此篇 霝兒的教學說明

請按以下連結

↓ 

霝兒小教學_關於部落格描述

(六)

版型語法套用

最後挑選想套用的版型語法 整個複製

至後台左側最下方【自訂樣式】點【CSS原始碼編輯】

將編輯區清空 貼上複製語法按儲存即可

 

以上落落長的圖文說明 希望大家有看有懂

或許能從其中找到部落版面套用疑點的解答

 引用語法如下：  
<p>&nbsp;</p> <p><span style="font-size: 14pt;"><img style="display: block; margin-left: auto; margin-right: auto;" src="http://i1126.photobucket.com/albums/l616/e314520520/love/love3/3-7.gif" alt="" width="408" height="49" /></span></p> <p style="text-align: center;">&nbsp;</p> <p style="text-align: center;"><span style="font-size: 14pt;">朋友問我 為什麼套用霝兒版面後 會出現不如預期效果</span></p> <p style="text-align: center;"><span style="font-size: 14pt;">我將此問題一一彙整 一併回答</span></p> <p style="text-align: center;"><span style="font-size: 14pt;">目前經測試 發現有下列幾項問題 皆可能導致版面跑版變形</span></p> <p style="text-align: center;"><span style="font-size: 14pt;">甚或其他不可預期的狀況產生</span></p> <p style="text-align: center;"><span style="font-size: 14pt;">痞客邦的版面套用 似乎沒像阿虎這麼簡易方便</span></p> <p style="text-align: center;"><span style="font-size: 14pt;">需注意下列幾項設定 煩請格友們自行檢查</span></p> <p style="text-align: center;"><span style="color: #ff0000; font-size: 14pt;">(一)</span></p> <p style="text-align: center;"><span style="font-family: 標楷體; color: #ff0000; font-size: 18pt;">解除不必要的App裝載</span></p> <p style="text-align: center;"><span style="font-size: 14pt;">至後台查看 App是否有太多不必要的加載</span></p> <p style="text-align: center;"><span style="font-size: 14pt;">若有 請解除設定或停用 只留幾項可用掛載即可</span></p> <p style="text-align: center;"><img src="http://imageshack.us/a/img823/5739/omm9.jpg" alt="" width="554" height="327" /></p> <p style="text-align: center;"><img src="http://imageshack.us/a/img197/9646/t6qu.jpg" alt="" width="600" height="1632" /></p> <p style="text-align: center;"><span style="color: #ff0000; font-size: 14pt;">以霝兒本身設定為例 目前也才安裝4項App(各位可自行斟酌解除或安裝)</span></p> <p style="text-align: center;"><span style="font-size: 14pt;"><img src="http://imageshack.us/a/img546/3756/4jig.jpg" alt="" width="600" height="432" /></span></p> <p style="text-align: center;"><span style="color: #ff0000; font-size: 14pt;">(二)</span></p> <p style="text-align: center;"><span style="font-family: 標楷體; color: #ff0000; font-size: 18pt;">公告版位內容設定 </span></p> <p style="text-align: center;"><span style="color: #000000; font-size: 14pt;">文字前若用語法 記得最後也要用語法結束</span></p> <p style="text-align: center;"><span style="color: #ff0000; font-size: 14pt;"><img src="http://imageshack.us/a/img546/1316/aon5.jpg" alt="" width="505" height="403" /></span></p> <p style="text-align: center;"><span style="color: #ff0000; font-size: 14pt;">(三)</span></p> <p style="text-align: center;"><span style="font-family: 標楷體; color: #ff0000; font-size: 18pt;">檢查自訂樣式進階版設定</span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;">通通設為<span style="color: #ff0000;">不修改</span> 背景顏色<span style="color: #ff0000;">清除</span></span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;"><span style="color: #ff0000;"><span style="color: #000000;">修改後記得按</span>儲存</span></span></p> <p style="text-align: center;"><span style="font-family: 標楷體; color: #ff0000; font-size: 18pt;"><img src="http://imageshack.us/a/img15/3195/onui.jpg" alt="" width="734" height="284" /></span></p> <p style="text-align: center;"><span style="font-family: 標楷體; color: #ff0000; font-size: 18pt;"><img src="http://img819.imageshack.us/img819/7637/zi6t.jpg" alt="" width="762" height="444" />&nbsp;</span></p> <p style="text-align: center;"><span style="font-family: 標楷體; color: #ff0000; font-size: 18pt;"><img src="http://imageshack.us/a/img46/474/s5sh.jpg" alt="" width="770" height="419" /></span></p> <p style="text-align: center;"><img src="http://imageshack.us/a/img443/7193/9uel.jpg" alt="" width="709" height="153" /></p> <p style="text-align: center;"><img src="http://imageshack.us/a/img10/3818/c7fr.jpg" alt="" width="717" height="433" /></p> <p style="text-align: center;"><span style="color: #ff0000; font-size: 14pt;">(四)</span>&nbsp;</p> <p style="text-align: center;"><span style="font-family: 標楷體; color: #ff0000; font-size: 18pt;">側邊欄位設定</span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;">此設定關乎三種版面套用是否平衡美觀 </span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;">請務必做調整</span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;"><img src="http://imageshack.us/a/img12/2407/sv79.jpg" alt="" width="600" height="200" /></span></p> <p style="text-align: center;"><img src="http://imageshack.us/a/img7/264/3tjq.jpg" alt="" width="600" height="245" /></p> <p style="text-align: center;"><img src="http://imageshack.us/a/img7/8890/h88c.jpg" alt="" width="600" height="250" /></p> <p style="text-align: center;"><span style="color: #ff0000; font-size: 14pt;">(五)</span></p> <p style="text-align: center;"><span style="font-family: 標楷體; font-size: 18pt;"><span style="color: #ff0000;">部落格描述設定</span></span></p> <p style="text-align: center;"><span style="font-size: 12pt;">部落版頭描述若想擺放如此整齊 段落分明</span></p> <p style="text-align: center;"><span style="font-size: 12pt;">像這樣 &darr;</span></p> <p style="text-align: center;"><span style="font-size: 12pt;"><img src="http://imageshack.us/a/img7/7038/0l2v.jpg" alt="" width="550" height="330" /></span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;">請參考此篇&nbsp;霝兒的教學說明</span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;">請按以下連結</span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;">&darr;&nbsp;</span></p> <p style="text-align: center;"><span style="color: #ff0000; font-size: 14pt;"><a href="http://e314520520.pixnet.net/blog/post/39522595" target="_blank"><span style="color: #ff0000;">霝兒小教學_關於部落格描述</span></a></span></p> <p style="text-align: center;"><span style="color: #ff0000; font-size: 14pt;">(六)</span></p> <p style="text-align: center;"><span style="font-family: 標楷體; color: #ff0000; font-size: 18pt;">版型語法套用</span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;">最後挑選想套用的版型語法 整個複製</span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;">至後台左側最下方【<span style="color: #ff0000;">自訂樣式</span>】</span><span style="font-family: 新細明體; color: #000000; font-size: 14pt;">點【<span style="color: #ff0000;">CSS原始碼編輯</span>】</span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;">將編輯區清空 貼上複製語法按儲存即可</span></p> <p style="text-align: center;"><span style="font-family: 新細明體; color: #000000; font-size: 14pt;"><img src="http://imageshack.us/a/img196/9782/0d89.jpg" alt="" width="650" height="247" /></span></p> <p style="text-align: center;"><img src="http://imageshack.us/a/img96/2828/km78.jpg" alt="" width="650" height="306" />&nbsp;</p> <p style="text-align: center;"><span style="font-family: 新細明體; font-size: 14pt;">以上落落長的圖文說明 希望大家有看有懂</span></p> <p style="text-align: center;"><span style="font-family: 新細明體; font-size: 14pt;">或許能從其中找到部落版面套用疑點的解答</span></p> <p><a href="http://e314520520.pixnet.net/blog/category/1782177" target="_blank"><img style="display: block; margin-left: auto; margin-right: auto;" src="http://forever0423.myweb.hinet.net/aaa/9-9.gif" alt="" /></a></p> <p style="text-align: center;">&nbsp;</p> <p style="text-align: center;">&nbsp;</p> <p style="text-align: center;">&nbsp;</p>