为Goggle Blogger添加自动文章摘要

2015/11/04
1 星2 星3 星4 星5 星 （投一票）
 2

Google Blogger首页是默认全文显示的，如果每个文章都很长，最后搞得首页很长很长。这就像个马脸，不仅不美观，而且读者就需要不断的下拉下拉再下拉！Blogger有插入自动阅读标示，这样首页显示的时候就显示插入点以前的地方。这功能好是好，但是有两个缺点。一是要手动，二是形成的摘要文字长度不一，不美观。网络上大部分的代码都是针对Blogger旧模板的，而新的Blogger改动较大。因此网络上大部分的代码对Blogger新模板都不适用。

没有怎么办？对我这种要求比较高的人真不行，那就自力更生。在Paul Crowe的网站：找到一段代码，上面也有教程，但是对于Blogger的新模板不太适合。经过息己摸索，最后成功实现。

1. 模板-修改HTML

2. 找到</head>，可以在模板内使用Ctrl+F

3. 在前插入以下代码：

  1. <script type='text/javascript'>
  2. var thumbnail_mode = "no-float" ;
  3. summary_noimg = 430;
  4. summary_img = 340;
  5. img_thumb_height = 120;
  6. img_thumb_width = 120;
  7. </script>
  8. <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功能找到<data:post.body/>

这时候你会发现有三个！到底是哪个？是最后一个，也就是这个：

  1. <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'>
  2. <data:post.body/>

把此处的<data:post.body/>替换成如下代码:

  1. <b:if cond='data:blog.pageType == &quot;item&quot;'>
  2. <data:post.body/>
  3. <b:else/>
  4. <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
  5. <data:post.body/>
  6. <b:else/>
  7. <div expr:id='&quot;summary&quot; + data:post.id'>
  8. <data:post.body/>
  9. </div>
  10. <script type='text/javascript'>
  11. createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
  12. </script>
  13. <div style='clear: both;'/>
  14. <span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >继续阅读... </a></span>
  15. </b:if>
  16. </b:if>

说明：代码中的红色部分可以换成自己喜欢的提示信息，我的就是[......]。

最后保存模板，查看博客，OK！

  • 本博客文章如未特别说明，皆为本站原创，默认采用署名-相同方式共享 4.0 国际协议

    • 相关文章

    《为Goggle Blogger添加自动文章摘要》有2个想法

    发表回复

    您的电子邮箱地址不会被公开。 必填项已用 * 标注