2010年10月3日 星期日

新版Blogspot範本有「繼續閱讀」的功能

https://blogger-script-study.blogspot.com/2010/10/blogspot-read-more.html

不知道這算不算新鮮事,相信很多人已經知道新版的Blogspot範本中已經有支援「繼續閱讀」的功能了,這篇文章只是為了補足文章中的缺塊~哈!

使用「繼續閱讀」有什麼好處?可以讓你的首頁或是搜尋結果更簡潔有力,有時候我們拜訪別人的網站的首頁時,常常會看到一些是密密麻麻的文章,想要繼續讀下一篇文章時還得把網頁往下一直捲,才會看到其他文章;搜尋文章時就更麻煩了,通常我們只想要看到文章標題或是少許摘要就好了,這樣可以幫助我們更快找到想要閱讀的文章,這有點像在搜尋引擎下輸入關鍵字,如果出來的結果是一整篇文章的內容,而不是只有文章標題及摘要,那搜尋者應該會很傷腦筋啊!

那要如何使用Blogspot的「繼續閱讀」功能呢?如果你使用Blogspot的線上文章編輯器,你可以在文章完成之後,把游標放在想要段落繼續閱讀的地方,然後按功能表上的「插入繼續閱讀標示」按鈕,如下圖。
Blogspot_readmore01

文章中就會出現長條形的繼續閱讀標示符號,你如果不滿意它出現的位置,也可以用滑鼠拖曳到別的地方。
Blogspot_readmore02

文章發表之後,就可以看到【閱讀更多 »】的繼續閱讀連結出現了,點按這個【閱讀更多 »就會展開整篇文章了。所以一般我們通常會建議部落格文章的標題要下得讓人一目了然文章在講什麼,或是在第一段就要點出整篇文章的重點。因為很多人都是憑文章標題或是摘要就決定要不要繼續閱讀文章的內容。
Blogspot_readmore03

如果你不滿意Blogspot內定的【閱讀更多 »】文字,你也可以更改成自己的文字。進入Blogspot的後台,點選「設計」主功能表,在「網頁元素」的次功能表下面的「網誌文章」方格內點選「編輯」。
Blogspot_readmore04

出現「設定網誌文章」的對話框,在【張貼頁面連結顯示文字:】後面的白色方框中更改文字內容。更改後如果想回到原來的內定文字,只要把新更改的文字刪除就會回到預設值了。
Blogspot_readmore05

假設我們把文字改成【…閱讀全部》】的文字,然後按「儲存」按鈕。
Blogspot_readmore06

重新檢視部落格首頁,就可以看到繼續閱讀的文字已經改成我們新增的內容了。
Blogspot_readmore07

如果你不是使用Blogspot的線上文章編輯舊器,而是使用如 Windows Live Writer 等的離線編輯器,你有可能無法直接由編輯器上使用「繼續閱讀標示」符號,這時候你可以切換到 「HTML/程式碼」格式,然後在需要加入繼續閱讀的地方插入下面程式碼就可以了

<!--more-->

舊版的Blogspot範本雖然也可以使用上面的程式碼,但是卻沒有繼續閱讀的連結出現在首頁的文章下方。


延伸閱讀:
回到》
Blogger 部落格技巧總整理

Blogspot推出「熱門文章」小工具
試用Blogger提供的新模板範本修改工具
用Blogger的「網頁」清單建立「導覽列」

8 則留言:

jerry 提到...
作者已經移除這則留言。
jerry 提到...

Dear 版主你好:

可以請教一下嗎?

因為我的blogger 如果按繼續閱讀

之後出現的文章,它的抬頭會變成#more

試了很久還是這樣

請問可以幫幫我嗎?

謝謝

我的網站是:http://www.teaez.tw/

工作熊 提到...

Jerry;
這應該是Google的blogspot的問題,等多一段時間看Google會不會解決吧!

betrice lai บีทรีซ ไล้ 提到...

请问我要从哪里找到“继续阅读 read more".我要我的文章收起来 betricelaiw4u.blogspot.com

工作熊 提到...

betrice;
就如同文章的圖片教學說明,「繼續閱讀」符號必須要自己加到文章中。

IRIS愛麗絲 提到...

blogger原設定閱讀更多的位置是在左側,
請問要如何把繼續閱讀的位置改到右側?
謝謝你^^

工作熊 提到...

IRIS;
這個應該需要改版型的CSS,建議你到這個Google+社群問看看 https://plus.google.com/communities/103807083735607134704

自由的靈魂 提到...
作者已經移除這則留言。