桃源水榭: 在Blogger的首页输出文章摘要

首页输出摘要的好处有很多，最明显的是避免了首页过长影响美观及读者的阅读体验。可不幸的是这个功能Blogger又没有提供。

##CONTINUE##

不过没关系，Blogger的自由使得我们可以做出任何事来，只要你能想得到！因此首页输出摘要只是小意思来着，网上的方法也很多。这里向大家推荐一个最好用的，就是台湾的小程序高手阿土伯写的Hack。

你只需进入『后台』，在『布局』处选择『添加小工具』，在弹出的窗口中选择『HTML/JavaScript』，在『职务』中填入＂##HIDEME##＂，就像这样：

然后在『内容』处加入以下代码：

<script src="http://blogger-ext2.googlecode.com/files/jquery.pack.js" type="text/JavaScript"></script>

<script src="http://blogger-ext2.googlecode.com/files/blogger_ext2-core-0.6.3.pack.js" type="text/javascript"></script>

<script src="http://blogger-ext2.googlecode.com/files/plugin_replace_continue_markup.pack.js" type="text/javascript"></script>

<script>
// 使用 URL 連結文章而非 javascript 動態展開

BloggerExtOptions.replace_continue_markup_as_link = true;
</script>

点击保存，完成！

以后写文章的时候只要在你想要截断的地方前面加上＂##CONTINUE##＂就能在首页输出＂##CONTINUE##＂前面的文字了！是不是很方便呢？

当然，之前的文章你得去修改才能显示摘要喽...

效果如下：

你点击＂Read More...＂后是进入贴子页。

－－－－－－－－－－－－－2－－－－－－－－－－－－－－－－－－－

由于这个办法是将首页完全载入后再用js把你不想显示的文字给隐藏起来，所以呢这里还有另一种方式供读者去阅读全文。

只需将上面的代码里面的：

<script>
// 使用 URL 連結文章而非 javascript 動態展開
BloggerExtOptions.replace_continue_markup_as_link = true;

</script>

替换成：

<script>
// 支援 繼續閱讀功能 // true = 開 false = 關
BloggerExtOptions.replace_continue_markup = true;
// 動態展開時，是否使用動畫效果
BloggerExtOptions.replace_continue_markup_animate= false;

// 繼續閱讀功能顯示之說明文字
// 可以是圖 img 或任何 html 語法
BloggerExtOptions.continue_markup_expand_title = ' [+]繼續閱讀全文....';
BloggerExtOptions.continue_markup_collapse_title = '[-]取消繼續閱讀全文....';
</script>

效果变成这样：