2015年2月7日 星期六

blogger之blogspot 繼續閱讀 樣式修改方式 part2

此篇文章接續 → blogspot 繼續閱讀 樣式修改方式 part1【視頻解說】

如還沒看過前篇,可點擊上述連結,進行查看。

在範本設計工具的進階內,新增CSS代碼之樣式修改方式

Ⅰ、範本 → 自訂



Ⅱ、進階 → 新增 CSS



Ⅲ、字體大小為16px及上下間隔25px樣式,貼上下述代碼

.jump-link{ margin-top:25px; margin-bottom:25px; font-size:16px; }

如果想要靠右,可加上text-align:right;,然後套用至網誌



完成後,如下圖:



Ⅳ、其他樣式修改參考,了解CSS的網友,可以自訂樣式

.jump-link{ margin-top:25px; margin-bottom:25px; padding:0px; }
.jump-link a{ color:#1492A3; text-decoration:none; border:1px solid #999999; padding:6px; font-size:16px; }
.jump-link a:hover{ color:#009933; border:1px solid #FF9900; }



完成後,滑數有未移至閱讀全文比較,如下圖:



Ⅴ、繼續閱讀 改成 閱讀全文 >> 或 閱讀更多 → 之方式

現在修改此項十分容易,版面配置 → 網誌文章 → 編輯



張貼頁面連結顯示文字,右邊框框改一下



然後下拉,儲存



此篇和前篇blogspot 繼續閱讀 樣式修改方式 part1【視頻解說】,都有key過教學,只是較為零亂分散,於是重新整理了一下,並拆成2篇。

久久更換範本風格的時候,會忘記如何修改,順便當成記錄,回頭查看,有需要的網友,也可參考看看。

同分類文章 → http://zfly9.blogspot.tw/search/label/15_Blog相關修改



對上述圖文教學,還不太明白的話,請至下方連結,查看youtube視頻解說。

此篇教學之youtube視頻解說:https://www.youtu.be/nqmAIPiYgJE


謝謝大家,抽空觀看,files備份檔名:blogspotguides 002

沒有留言:

張貼留言