改善Hexo生成页面的描述信息

作者

本文版权归作者所有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。

转载自夜明的孤行灯

本文链接地址: https://www.huangyunkun.com/2014/03/26/hexo-description-detail/

其实严格来讲这是针对具体的模板而言，不过其中涉及到Hexo的一些数据的调用，所以还是算作Hexo的一个优化吧。

问题主要源于检查自己的博客被收录的情况，Google很给力，收录了200+，而百度就一页…

如图所示，Google的很多搜索结果的描述部分是一样的，看着死活觉得不爽，所以来改进一下。

原因分析

首先看看这句话出自哪里，是在_config.yml的配置中出现的。根据这个配置这些文字又被写到html页面的head中。

对于描述信息的具体细节可以参考Google站长帮助—标题和描述。

简单说我们要尽可能提供清晰的描述，这些描述要准确且不重复，可以手动也可以程序生成。当然在Hexo中我们肯定首推程序生成。

修改

不同的主题可能具体的文件不一样，不过原理是一致的。我以我使用的Pacman模板为例。

需要修改的是head.ejs,先看看原始定义：

<% } if (page.description){ %>
<meta name="description" itemprop="description" content="<%= page.description %>">
<% } else if (config.description&&(!is_post())){ %>
<meta name="description" content="<%= config.description %>">
<% } else if (page.excerpt){ %>
<meta name="description" content="<%= strip_html(page.excerpt).replace(/^s*/, '').replace(/s*$/, '') %>">
<% } else if (page.content){ %>
<meta name="description" content="<%= strip_html(page.content).replace(/^s*/, '').replace(/s*$/, '').substring(0, 150) %>">
<% } %>

从上往下一次是如果页面本身定义了description那么直接使用（不知道这个在哪里指定），然后是判断当前页面是否是文章，不是的话使用配置文件中的描述，这也是在Google搜索结果中大量重复的原因，再其次是从文章内容中抽取描述。

目前看我们需要改进的只有归档页面，tag页面和分类页面。

先定义一个description变量，并指定它的优先级最高：

<% var description; %>
<% if (description){ %>
<meta name="description" itemprop="description" content="<%= description %>">
<% } else if (page.description){ %>
<meta name="description" itemprop="description" content="<%= page.description %>">
<% }...

然后来组装内容，使用is_tag等来判断页面类型，最后附上一部分所属文章的标题。

比如Libgdx这个标签生成的描述应该是：‘Libgdx分类下的文章:Libgdx基于RoboVM对IOS平台的支持,maven和libgdx,如何使用libgdx编写一个简单的游戏（三）— 人性化,如何使用libgdx编写一个简单的游戏（二）— 完善,如何使用libgdx编写一个简单的游戏（一）— 雏形,android游戏开发框架libgd…’。

获取所属的文章可以调用Hexo的page.posts.each(fn)，最后代码如下：

var description;
if(is_tag()||is_category()||is_archive()){
if(is_tag()){
description='标签为'+page.tag+'的文章:';
}elseif(is_category()){
description=page.category+'分类下的文章:';
}elseif(is_archive()){
description='';
if (is_month()){
description += page.year +'年' + page.month+'月';
}elseif (is_year()){
description += page.year +'年';
}
description+='归档文章:';
}
page.posts.each(function(item){
description+=item.title+',';
});
var subLength=150;
if(description.length<150){
subLength=description.length-1;
}
description=description.substring(0, subLength);

这样就可以让归档，分类，tag的页面显示出相关的描述信息了。

本文版权归作者所有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。

转载自夜明的孤行灯

本文链接地址: https://www.huangyunkun.com/2014/03/26/hexo-description-detail/

发表评论