Jump breaks!! Blogger 官方版的繼續閱讀(read more)功能
9月9日 blogger 官方部落格已宣佈開放繼續閱讀 (read more)的功能.設定方式很容易,也不需要自行加入程式碼,只要在寫文章時按一下 Jump breaks 鍵,就能在首頁時只顯示摘要,想看全文時,一按下閱讀全文的連結後,才連到該文章的頁面.
Blogger 日前發布了這篇文章You might as well jump裡,就宣佈了read more (閱讀全文)的功能.只是想使用這功能,還要先設定一些條件.
1. 要在 http://draft.blogger.com/裡使用, draft blogger 與 blogger 使用方式一樣, 只是draft blogger裡會有一些即將正式上線的新功能,可以搶先使用.
登入draft blogger後(使用的帳號密碼與blogger一樣), 點選 設定-->基本.
2. 在一般設定裡, 點選 新版文章編輯器 --> 按下 儲存, 不然目前還看不到 jump breaks 的按鈕.
3. 這時在文章頁面的撰寫模式下, 就會看到一個 Jump breaks 的按鈕.
4. 如果想改 閱讀全文的 文字, 可進到 版面配置中的網頁元素裡, 點選 網誌文章 的編輯按鈕.
5. 在這裡, 就可以更改 閱讀全文的 顯示文字.
6. 以後在寫文章時,想使用閱讀全文(read more)的功能, 只要在按下 Jump breaks 按鈕後, 就可以自動把文章切開. 看到的效果如下.
7. 在 HTML 頁面,可以看到其實是插入一行 程式碼 <!-- more -->.
8.發佈文章後, 就可以在首頁看到效果了.
這佪功能對於目前還沒加入改版程式碼的blogger而言,應該是很容易就能使用. 然而模板若是採用非blogger預設版型,且已加入其他的改版程式,有可能運作上會有些不同.
此時可參考這篇文章,做進一步修改.參考來源:
Creating 'After the jump' summaries
You might as well jump
15 comments:
10/06/2009
太棒了，之前在这里找到很多有用的功能，现在blogspot都内置了，希望赶快推出锁文章的功能，到时要劳烦skyvee你介绍了 [:
10/06/2009
Kahyan,
謝謝你的留言, 最近blogger也有動作在收集大家的建議,也許很快就能看到鎖文章的功能了!:)
11/01/2009
您好
無意中逛進來
因為剛玩blogger
覺得好像老是卡卡的
左下角訊息列老出現網頁錯誤
現在我遇到一個比較麻煩的問題是
我套了網路上的版型不喜歡再回來制式版型後
文章上的日期不見了
都出現undefined
就算我在設定有打勾還是沒用
不知您知道是那兒出問題嘛
打擾之處抱歉
謝謝
11/04/2009
您好,
看起來,你少一段date-header, 不過我不知道你的版型是否適用,你可以先試看看.
先找到 ＜b:loop values='data:posts' var='post'>,在這行後面加入以下這段程式碼。
＜b:if cond='data:post.dateHeader'>
＜h2 class='date-header'>＜data:post.dateHeader/>＜/h2>
＜/b:if>
記得把全形＜改成半形 < 喔！
11/16/2009
版主您好，
可否請問您，我本身的blogger常常會發生整個版面跑掉的情形。我目前是使用blogger的預設版面scribe，但是當我換版面時，常常側邊欄的一些小工具會被擠到整個版面的下方，可否請問這個問題該如何解決呢？謝謝您^^
11/16/2009
skippy,您的blog不公開,我無法連進去看哩!不知道你所提的換版面是什麼意思?是指進入單篇文章時,側邊欄會被擠到下方嗎?那可以找找文章區(post) 寬度(width)的設定.
11/17/2009
我的BLOGGER也出現版面跑掉的問題...請你可以幫我去看一下嗎...我ㄧ直找不到問題.也試過上面的方法了..謝謝
11/18/2009
板主您好，
謝謝您的回答，我的問題正是您所說的那樣，可是我還是不會修正。可否請您幫我看一下呢？
抱歉我沒有公開個人簡歷頁，但請您照訪這個網址：
http://skippyho-health.blogspot.com/
謝謝您的幫忙
11/18/2009
古家農場, Skippy 兩位好,
大略看了一下兩位的網頁原始碼,目前還無法確定原因,看樣子必須要跟兩位要原始碼了,如果方便的話,請提供原始碼讓我測看看.:)
11/19/2009
板主您好，
謝謝您熱心的幫忙，請問您說的原始碼是這個嗎？
http://www.sendspace.com/file/gnrsfq
11/19/2009
版主我也要謝謝你的熱心幫忙
希望你能幫我們解決這問題
感謝
http://www.sendspace.com/file/pyqvh6
11/19/2009
兩位好,
目前已找到問題, 主要是因為jump-link這個blogger官方版的繼續閱讀功能,會在一些狀況下,讓文章版面出現問題,如sidebar會跑位.也就是說,如果文章中, 一整段的文章裡,＜!-- more -->出現在被＜div>ＸＸＸＸ＜/div>包住的情況下,很容易就會讓版面走樣.
舉例來說,我們在寫文章時,可能會習慣用粗體,黑體或改變字型大小,字體樣式,來特別標示文章中某些句子,通常會直接用編輯器上的功能或是自己下語法，如＜div style="color: black; font-family: "Courier New",Courier,monospace;">這些文字這些文字這些文字這些文字這些文字這些文字＜/div>.
如果在這段文字中,加入jump breaks,也就是＜!-- more -->, 如以下
＜div style="color: black; font-family: "Courier New",Courier,monospace;">這些文字這些文字這些文字這些文字＜!-- more -->這些文字這些文字＜/div>.
那這時, 版面就會出錯了.sidebar會移到文章下方.
如何確定是這問題呢? 進入單篇文章閱讀時,版面是正常的, 但是在首頁時就會有問題.
解決方式
1.不用jump breaks這功能
2.在文章的html頁面,找出＜!-- more -->被埋在＜div>XXXX＜/div>的段落,先讓前一個＜div>結束掉，也就是改成＜div style="color: black; font-family: "Courier New",Courier,monospace;">這些文字這些文字這些文字這些文字＜/div>＜!-- more -->＜div style="color: black; font-family: "Courier New",Courier,monospace;">這些文字這些文字＜/div>.
這樣就行了。請參考。
11/19/2009
謝謝板主的幫忙，您真是太厲害啦.....完全就是您說的那個問題，依照您所說的方式，我已經解決問題啦！！太感謝您了^^
11/19/2009
真的很感謝版主...你幫我解決問題了!
希望有機會可以再跟你連絡..謝謝.
Skippy你也成功了啊.恭喜你
11/19/2009
兩位不用客氣,要謝謝你們提出來,大家能一起研究,有成功我也很開心呢! ^^
我要留言
謝謝您願意在此分享心得, 讓文章內容更豐富.
這篇文章被引用到...