2009年5月7日 星期四

Blogger 繼續閱讀懶人加強版

安裝步驟:
1. 到Blogger的控制(後台)頁面
2. 「版面配置」->「網頁元素
3. 按下「新增小工具」,出現可用的小工具清單
4. 找一個名稱為「 HTML/JavaScript」,按下滑鼠左鍵,會進入設定的頁面
5. 「標題」欄位,請填入 ##EasyReadMore##
6. 「內容」部份,請複製以下程式碼填入


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script src="http://cjh829-easy-read-more.googlecode.com/files/cjh829-easy-read-more-2.2.0.js" type="text/javascript"></script>
<script>
EasyReadMoreSettings.Enabled = true;
EasyReadMoreSettings.Read_More_Mode = 'mix';
EasyReadMoreSettings.Mode_Auto_MaxLine = 3;
EasyReadMoreSettings.Mode_Custom_Tag_Type = 'text';
EasyReadMoreSettings.Mode_Custom_Tag_Expr = '##ReadMore##';
EasyReadMoreSettings.Link_Style = 'directlink';
EasyReadMoreSettings.Link_Text = '...繼續閱讀';
EasyReadMoreSettings.Link_Text_title = '繼續閱讀';
EasyReadMoreSettings.Collapse_Link_Text = '顯示摘要...';
EasyReadMoreSettings.Collapse_Link_Text_title = '顯示摘要';
EasyReadMoreSettings.Collapse_MoveToEnd = false;
EasyReadMoreSettings.Collapse_Effect = 'none';
EasyReadMoreSettings.Collapse_Effect_Speed = 'normal';
EasyReadMoreSettings.Index_Page_Style = 'abstract';
EasyReadMoreSettings.Tag_Page_Style = 'title';
EasyReadMoreSettings.Archive_Page_Style = 'title';
EasyReadMoreSettings.Controller_Enabled = true;
EasyReadMoreSettings.Controller_Default_Position = true;
EasyReadMoreSettings.Controller_Splitter = ' | ';
EasyReadMoreSettings.Controller_Full_Text = '完整';
EasyReadMoreSettings.Controller_Abstract_Text = '摘要';
EasyReadMoreSettings.Controller_Title_Text = '標題';
EasyReadMoreSettings.ShowFullPost_Tag = '##ShowAll##';
</script>
<script>EasyReadMore.main()</script>


7. 按「儲存變更」,安裝完成

說明如下:

1.縮文(繼續閱讀)模式設定(預設值:mix模式)

* Auto模式:EasyReadMoreSettings.Read_More_Mode = 'auto';
* Custom模式:EasyReadMoreSettings.Read_More_Mode = 'custom';
* Mix模式:EasyReadMoreSettings.Read_More_Mode = 'mix';

2.Auto模式下,文章最大行數(超過就自動縮文) (預設值:3行)
EasyReadMoreSettings.Mode_Auto_MaxLine = 3;
數字'3'改成想要的行數即可

3.Custom模式下,代表繼續閱讀的特殊符號(預設值:##ReadMore##)
支援阿土伯版本的符號(##CONTINUE##)
以及一般常見的<span id='fullpost'> 或 <span class='fullpost'>

範例:
相容阿土伯版本的符號
EasyReadMoreSettings.Mode_Custom_Tag_Type = 'text';
EasyReadMoreSettings.Mode_Custom_Tag_Expr = '##CONTINUE##';

相容<span id='fullpost'>
EasyReadMoreSettings.Mode_Custom_Tag_Type = 'id';
EasyReadMoreSettings.Mode_Custom_Tag_Expr = 'fullpost';

相容<span class='fullpost'>
EasyReadMoreSettings.Mode_Custom_Tag_Type = 'class';
EasyReadMoreSettings.Mode_Custom_Tag_Expr = 'fullpost';

4.設定繼續閱讀連結樣式(預設值:directlink(直接連結))

* 直接連結:EasyReadMoreSettings.Link_Style = 'directlink';
* 展開/收合:EasyReadMoreSettings.Link_Style = 'collapsible';

5.設定繼續閱讀按鈕顯示文字,以及連結的title屬性
顯示文字:
EasyReadMoreSettings.Link_Text = '...繼續閱讀';
連結title屬性:
EasyReadMoreSettings.Link_Text_title = '繼續閱讀';

6.設定收合按鈕顯示文字,以及連結的title屬性(只有在樣式設定為「展開/收合」時才有效)
顯示文字:
EasyReadMoreSettings.Collapse_Link_Text = '顯示摘要...';
連結title屬性:
EasyReadMoreSettings.Collapse_Link_Text_title = '顯示摘要';

7.文章展開後,收合按鈕是否移動(只有在樣式設定為「展開/收合」時才有效)(預設值:不移動)
不移動,取代繼續閱讀按鈕
EasyReadMoreSettings.Collapse_MoveToEnd = false;
繼續閱讀按鈕消失,收合按鈕出現在文章最後
EasyReadMoreSettings.Collapse_MoveToEnd = true;

8.設定展開/收和動畫效果(只有在樣式設定為「展開/收合」時才有效)(預設值:沒有動畫)
沒有動畫(none)
EasyReadMoreSettings.Collapse_Effect = 'none';
滑動(slide)
EasyReadMoreSettings.Collapse_Effect = 'slide';
淡入淡出(fade)
EasyReadMoreSettings.Collapse_Effect = 'fade';

9.設定展開/收和動畫速度(只有在樣式設定為「展開/收合」時才有效)(預設值:正常)
速度慢
EasyReadMoreSettings.Collapse_Effect_Speed = 'slow';
速度正常
EasyReadMoreSettings.Collapse_Effect_Speed = 'normal';
速度快
EasyReadMoreSettings.Collapse_Effect_Speed = 'fast';

10.設定各頁面預設顯示方式,有三種:

* 繼續閱讀(摘要) - abstract
* 只有標題 - title
* 全文 - full

設定blog首頁:(預設值:摘要)
EasyReadMoreSettings.Index_Page_Style = 'abstract';
設定標籤(tag)分類頁:(預設值:標題)
EasyReadMoreSettings.Tag_Page_Style = 'title';
設定blog存檔(archive)分類頁:(預設值:標題)
EasyReadMoreSettings.Archive_Page_Style = 'title';
註:按下「較舊的文章」、「較新的文章」顯示的頁面也是屬於archive分類頁

11.是否啟用快速切換按鈕(預設值:啟用)

* 啟用:EasyReadMoreSettings.Controller_Enabled = true;
* 停用:EasyReadMoreSettings.Controller_Enabled = false;

12.快速切換按鈕是否放在預設位置(在文章列表的頭和尾各顯示一個)(預設值:是)
放在預設位置:
EasyReadMoreSettings.Controller_Default_Position = true;
自訂位置(需自行修改範本html):
EasyReadMoreSettings.Controller_Default_Position = false;

註1:可用css操控快速切換按鈕,class為"read-more-controller"
註2:若要自訂顯示位置,請在範本的html內想要擺放的位置上插入:
<div class="read-more-controller"></div>
快速切換按鈕會自動加在裡面

13.自訂快速切換按鈕的分隔符號(預設值: | )
EasyReadMoreSettings.Controller_Splitter = ' | ';
修改紅色字部份即可

14.修改快速切換按鈕的顯示文字
完整模式的顯示文字:
EasyReadMoreSettings.Controller_Full_Text = '完整';
摘要模式的顯示文字:
EasyReadMoreSettings.Controller_Abstract_Text = '摘要';
標題模式的顯示文字:
EasyReadMoreSettings.Controller_Title_Text = '標題';

15.設定文章為「顯示全文」(不縮文)的特殊符號(預設值:##ShowAll##)
在文章的任意地方,插入此特殊符號,則該篇文章就會被略過(不執行縮文動作)

可自訂特殊符號
EasyReadMoreSettings.ShowFullPost_Tag = '##ShowAll##';




文章引用:繼續閱讀懶人加強版: [BLOGGER]繼續閱讀懶人加強版

沒有留言:

張貼留言

Random Post

  • 戰鬥前的預熱 《龍珠改》
    05.05.2009 - 0 Comments
    詳細系統說明 戰鬥前的預熱 《龍珠改》詳細系統說明Bandai定於4月29日發售的《龍珠改…
  • MP3 鈴聲剪輯工具 mp3DirectCut
    09.08.2009 - 0 Comments
  • 你也可以拍攝大頭狗 - 巧妙使用鏡頭變形來製造特別效果
    08.06.2009 - 0 Comments
    鏡頭變形(Lens distortion)其實是光學原理所做成的,桶狀變形(Barrel distortion)常見於廣角端而枕狀變形(Pincushion…
  • Handy Alarm Pro (s60v5)
    23.06.2009 - 0 Comments
    在智慧型手機上設定鬧鈴和備忘錄,定時提醒用戶重要事項和生活瑣事。Handy Alarm Pro軟件支援所有響鬧及備忘事宜。…
  • 為 Blogger 加上最新回應
    08.05.2009 - 0 Comments
    今天瀏覽網站時,看到一個標題叫最新回應 2.0 來囉!進去看看是什麼 @@,原來是一個十分好用的插件,他可以把你最新的回應顯示在你的 Blogger 任何位置。有興趣可以連結到 (LVCHEN 的美國生活指南:…