为Blogger (BlogSpot)添加自动文章摘要
Blogger首页是默认全文显示的,如果每个文章都很长,最后搞得首页很长很长。这就像个马脸,不仅不美观,而且读者就需要不断的下拉下拉再下拉!Blogger有插入自动阅读标示,这样首页显示的时候就显示插入点以前的地方。这功能好是好,但是有两个缺点。一是要手动,二是形成的摘要文字长度不一,不美观。网络上大部分的代码都是针对Blogger旧模板的,而新的Blogger改动较大。因此网络上大部分的代码对Blogger新模板都不适用。
没有怎么办?对我这种要求比较高的人真不行,那就自力更生。在Paul Crowe的网站:找到一段代码,上面也有教程,但是对于Blogger的新模板不太适合。经过息己摸索,最后成功实现。
1. 模板-修改HTML
2. 找到,可以在模板内使用Ctrl+F
3. 在前插入以下代码:
<script type='text/javascript'>
var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript' src='http://widgets.way2blogging.org/blogger-widgets/w2b-auto-readmore-blogger.js' ></script>
说明:
summary_noimg = 430:是指如果文章的长度少于430个字符,就不插入摘要,直接显示全文
summary_img = 340:指如果文章有图片的话就把图片转化成缩略图在首页显示
img_thumb_height = 120:指形成的缩略图的高度
img_thumb_width = 120:指形成的缩略图的宽度
上面的数值可以根据自己的要求更改
4. 利用Ctrl+F功能找到
这时候你会发现有三个!到底是哪个?是最后一个,也就是这个:
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id' itemprop='articleBody'>
<data:post.body/>
把此处的<data:post.body/>替换成如下代码:
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>");
</script>
<div style='clear: both;'/>
<span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >继续阅读... </a></span>
</b:if>
</b:if>
createSummaryAndThumb("summary");
说明:代码中的红色部分可以换成自己喜欢的提示信息,我的就是[......]。
最后保存模板,查看博客,OK!
评论
发表评论
欢迎交流指正