给基于WordPress的网站页面添加描述和关键词

今天不知道怎么突然兴致来了,很想给我的网页也加上描述和关键词这两个元标记(meta信息)。这个我不懂啊,所以进入Google大学学习了一下。可惜没有找到能直接修改就用的代码,甚至连正确的方法都是自己摸索出来的。发出来与大家共享,如果网友们有好的建议请不吝告知。

纠结了半天,还是决定不要直入正题的好,免得到时候有人问这问那,我都忘记了答不上来也是很郁闷的事情。给大家一个分段链接吧:

一、描述和关键词meta元标记简介

嗯,简单介绍下,主要是我自己的感受。专业的讲解网上一搜一大把,我就不多此一举了。你要是懒得搜,就直接点这里看看吧,或者看看来自Google官方的说明文档:什么是元标记、什么是标题和描述

description(网页描述)和keywords(网页关键词)meta元标记是放置在页面<head> </head>标签内的描述性内容,供搜索引擎使用。可以告诉搜索引擎本页的内容提要和关键词。表示方式为:

<meta name=”keywords”  content=”网页的关键字” />

<meta name=”description”  content=”网页描述” />

当然,根据我之前的经验,没有这些东西似乎并没有什么影响。搜索引擎会自动为你生成描述和关键词,只是会比较慢,而且不一定准确。我只是一时兴起,做来玩玩。不过还是有一些效果的:现在如果搜索我的站名,水景一页,就会看到在站名下面的描述是我用description加上去的,不再是Google自己生成的,包含了我的站点描述、导航菜单的那些内容。看起来舒服多了。

Meta description的作用

生成摘要。当Google创建搜索引擎结果页面的时候,它可能会使用description标签来构建页面摘要,显示在搜索结果链接的下面。

目录提交。一些目录服务会使用页面的description信息作为目录列表上的描述。尽管有人工编辑的目录服务,但更多的是自动生成的目录服务。

至于keywords。有人说Google已经不再支持keywords了,意思是Google不再以这个作为判断标准,因为很多站长用关键词来欺骗搜索引擎。反正,Google的官方文档中已经找不到关于关键词的说明了。但是Google说了,会忽略掉不认识的元标记。所以,就算你的关键词添加得不好,也不会影响Google对你这个站的态度。

二、网页的关键词和描述添加原则

1、尽量准确。

很多网页上介绍这两个名词的时候都说是“网站……”,但是我的理解是,应该说“网页……”。毕竟每个页面上的内容都不是完全一样的,怎么会有相同的描述和关键词呢?看看Google给出的介绍,也是说“网页”。所以,第一个原则就是尽量准确概括描述网页内容和关键词。

为了省事,我直接使用文章摘要作为描述,用标签作为该页的关键词。相信大家在WordPress后台编辑文章的时候都设置了标签,不过好好写摘要的可能就不多了。呵呵,我就没有好好写,决定以后好好写了。

在WordPress中,可以用相应的PHP语句来判断该页面属于首页、静态页面(page)、分类、标签还是文章等等,可以实现自动匹配显示相应的关键词和描述内容。

2、字数限制。

网上很多地方在说关键词和描述字数不能太多。关键词字符数应在 100 个以内,而描述的字符数在 200 个以内。

我不清楚,所以就按照这个标准来了。已修正为限制 200 个字符。但是我想稍微多点儿应该问题不大。特别是描述,我可不知道怎么通过 PHP 程序来截短显示。不过现在已经使用 wp_html_excerpt() 函数来截断。

暂时就想到这么多了。

三、给WordPress主题模板添加描述和关键词

WordPress是动态网页程序,要给它的页面添加描述和关键词,还得修改它的主题模板。似乎很少有主题默认支持显示描述和关键词的。

不过目前有不少 SEO 插件能够自动完成这些工作,比如 All in One SEO Pack,我还是选择不用,太复杂,也太占用服务器的资源了。我是觉得没有必要,这种事很容易通过修改主题模板来完成。

1、建立子主题。

要修改主题的模板,最好还是先建个子主题吧。可以参考我的另一篇文章

当然,直接去修改主题文件也不是不可以。

2、编辑header.php文件。

将主题文件夹中的header.php复制到相应的子主题文件夹中来修改。

在<head>标记之后,</head>标记之前插入下面的内容:

<?php // add meta keywords and description by conditionary
//以下内容针对网站首页
if ( is_home() || is_front_page() ) { //判断是否为首页
    $description = "分享WordPress及插件、主题使用经验;电脑和网络的使用方法、技巧、故障排除;软件,特别是办公软件的使用技巧;教学、学习、考研方法交流;电影、电视剧、音乐体验……";//将双引号中的内容修改为你自己的
    $keywords = "博客, WordPress, 计算机, windows, 软件, 教学, 插件, 表格, 物理, 教程, go daddy, godaddy, 主机, 空间, 域名, 购买";//将双引号中的内容修改为你自己的
}

/**
* 以下内容针对单个文章页面、静态页面,但排除附件页面
*/
elseif ( is_singular() && !is_attachment() ) {
    /**
     * 2012.06.16 add !is_attachment() to not display these on attachment pages
     * or, we could figure out proper description and kewwords to show on attachment pages, then revise it
     */
	$exerpt = $post->post_excerpt; //2012.11.01 因 get_the_excerpt() 会在没有设定 excerpt 时自动生成一个 excerpt 而导致某些情况下出错。
	if ( $exerpt != '') { //是否存在摘要
		$description = $exerpt; //使用文章摘要作为描述
	}
	else {
		$description = $post->post_content; //使用文章内容的前 200 个字符(后面会进行截短)作为描述
    }

	$keywords ="";
	// 2013.10.09, 在下面的查询中增加一个参数以减少数据库查询强度,得到一个仅仅包含标签名称的数组,因而下面的也变简单了
	$tags = wp_get_post_tags( $post->ID, array( 'fields' => 'names' ) );
	$keywords = implode(",", $tags);
}

//以下部分留着,目前还没想好怎么处理静态页面、分类、标签和日期存档页
//相信很多人跟我一样,懒得给每个分类和标签都添加说明
// 2012.11.01 已激活部分内容,会自动判断以决定是否显示到页面源代码中
elseif(is_category()) {
    $description = category_description();
// $keywords = "";
}
elseif(is_tag()) {
    $description = tag_description();
// $keywords = "";
}

//判断前面的程序是否给 description 赋予了具体内容
//如果没有就不在网页源代码中显示这一部分
if ( $description != '' ) {
    // 2015.01.25
    // 清理类似  的标记
    $description = preg_replace('#\[[^\]]+\]#', '', $description);
    // 清理 description 中的 HTML 代码,并截短为 200 个字符
    $description = wp_html_excerpt( wp_strip_all_tags( $description, true ), 200 );
?>
    <meta name="description" content="<?php echo $description; ?>" />
<?php }

//类似 description 来处理 keywords
if ( $keywords !='' ): ?>
    <meta name="keywords" content="<?php echo $keywords; ?>" />
<?php endif; ?>

注:上面 // 后面以及 /* 和 */ 之间的文字是 PHP 的注释,实际使用时可以删除。

为了方便大家使用,提供了一个包含上述代码的 php 文件,你可以下载后解压,直接从里面复制代码。

四、注意事项

1、文件编码格式问题。

如果你像我前面的例子那样,给描述和关键词手工添加了中文内容,需要将 header.php 转换为UTF-8编码格式(推荐使用 Notepad++格式 ——>转为 UTF-8 无 BOM 编码格式)。否则,当你直接用浏览器的查看页面源文件功能查看页面代码的时候,这一部分会显示为乱码。

2、使用Twentyten主题时,描述中包含“继续阅读”链接的处理办法。

根据 2012.11.01 的第三次更新第 2 条,此问题已不会再出现。

WordPress 3.0以后自带的主题 Twentyten 使用了自定义的函数来给摘要(excerpt)添加“继续阅读(Read more ——>)”链接。这个会导致上面使用的 get_the_excerpt() 函数返回的内容除了包含正常的摘要之外,还在后面附带了一个HTML格式化的“继续阅读”链接。如果把这个放在页面描述里似乎不大合适,至少非常不美观,还占用了字符数。可以用下面的方法进行处理。只是这样处理后,你发表的文章就不会自动以摘要的形式显示在归档(首页、分类页、标签页、日期归档页等)页面了。不过我都是手动在需要截短的地方插入分页( more )标记的。

在你创建的子主题文件夹里新建一个 functions.php 文件,将下面的代码复制进去并保存:

<?php
add_action( 'after_setup_theme', 'my_child_theme_meta_setup' );
function my_child_theme_meta_setup() {
// We are providing our own filter for excerpt_length (or using the unfiltered value)
remove_filter( 'get_the_excerpt', 'twentyten_custom_excerpt_more' );
}

或者直接下载这个已经编辑好的 functions.php 文件放入该子主题目录里。

五、后记

1、这篇文章本来前些天快编辑完成了,可是由于网络和浏览器错误,导致丢失了很多内容。今天重新编写,可是很多东西已经记不清楚了。我会在随后的一段时间里随时修订本文,添加一些补充性的说明。

2、这段代码还没有完全实现我的想法,可能要很长时间才能完善了。

3、可以通过站长之家的网页 META 信息检查工具检测你的成果。

六、更新日志

2015.01.25

增加对类似 BBcode 的 WordPress 标记,如 的检测和去除。详见更新说明

2013.10.09

优化一个查询函数。详见更新说明

2012.11.01

较大更新、代码优化。具体请参阅第三次更新说明

2012.07.17

做了较大更改和优化。具体情况请参见更新说明

2010.11.05

更换使用的 WordPress 函数 is_singular() 为更恰当的 is_single()。具体情况请参见更新说明©

本文发表于水景一页。永久链接:<http://cnzhx.net/blog/add-wordpress-meta-description-keyword-php/>。转载请保留此信息及相应链接。

69 条关于 “给基于WordPress的网站页面添加描述和关键词” 的评论

  1. 谢谢,太照顾使用默认模板的人了。现在我也成功的用上了来自摘要的描述了。很爽。呵呵。

  2. 引用通告: 关于本站发布的WordPress描述和关键词PHP代码更新公告 « 水景一页

  3. add_action( ‘after_setup_theme’, ‘twentyten_setup’ );
    function twentyten_setup() {
    // We are providing our own filter for excerpt_length (or using the unfiltered value)
    remove_filter( ‘get_the_excerpt’, ‘twentyten_custom_excerpt_more’ );
    }

    这段代码加到fuctions.php 末尾就可以了,建什么子主题多麻烦啊

  4. 不错!不错!找了很久了!呵呵~谢谢啊!用上了!希望能继续更新!观注中!

    • 呵呵,其中很多都是说明性的文字,还有些是预留的,其实是为了更方便。不管有多少,只需要复制粘贴一下,然后按照自己的需要修改内容就好了。
      你也可以用插件来实现啊,应该有这样的 SEO 插件的。

  5. 引用通告: Google +1 按钮更新,可直接分享文章至 Google+ « 水景一页

  6. 可能是我的WP只用一个自动回复的插件,插件少就快点。

    可能服务器的地点(香港)离你浏览的地点近吧。

    我还有个bulehost的,慢啊,在想办法CDN,有没有分享下的文章

    • 我觉得 CDN 用起来太麻烦了,效果也不见得好,除非是国内的。
      这里有个国外的,可以免费试用,你可以看看:https://www.speedymirror.com/

    • 看了前面几篇,似乎是用的文章标题做为描述的,所有有此一问 —— 没有详细研究。

    • 呵呵,原来如此。其实这 2 个 META 不是特别重要的事情,我是这么觉得的。

  7. 我不注重seo的…
    所以….
    只是为了好看点…
    这两个还是有点用的…搜索引擎内页显示时是显示你提供的描述

  8. 哈哈。。。博主这里好东西真多,,我今天正纠结这事情呢,百度一下,您博客名字这熟悉的几个字马上映入我的眼帘,偶就毫不犹豫的点击了进来,呵呵。。我现在搞不懂得是,原来wordpress的顶部文件是这样子写的

    <meta http-equiv="keywords" content="” />
    <meta http-equiv="description" content="” />
    <link rel="pingback" href="” />

    后来在站长工具里面查不到网站的关键字与描述所以我就改成了北京刑事律师_刑事辩护律师_中国刑事辩护律师网

    <link rel="pingback" href="” />

    这个样子,但是有人说这样写代码不如原来wp默认的写法好,所以想问一下博主,哪一个更好,或者博主有没有更好的写法?
    谢谢博主分享

      • 原来的是这个样子的

        <meta http-equiv="keywords" content="” />
        <meta http-equiv="description" content="” />
        <link rel="pingback" href="” />

        可是这个样子站长工具是检测不到关键字与描述的呀

        • 就是说啊,你的虽然有这个定义,但是把它定义成空的了,当然检测不到了。双引号中间有内容才能检测到的。
          你看看我的页面的源代码就理解了。

        • 我晕,为什么我粘贴不完全呢?我给您发邮件吧。。粘贴上去后面的自动就删掉了

          • 你还是别用那个 http-equiv 吧,那个好像是用来定义别的动作的。关键词和描述都是有自己的写法的,参考刚才的回复。

  9. 双引号后面有东西的,不过是我粘贴上之后自动就给屏蔽了,不知道什么原因,双引号里面写的是

    • 因为 WP 的安全检查吧。

      我知道你是怎么回事儿了。已经给你回复。

      另外,关键词不能用 _ 来分割,而是用英文半角的逗号 ,

  10. 您的意思是说,我只能是删掉http-equiv 之后用All in One SEO Pack这个插件了吗?
    删掉http-equiv 这个之后对网站没有什么副作用吧?我还是希望能不用插件就直接搞定每一个页面的关键字跟描述。。希望博主赐教

    • 不用插件就只能用我这里介绍的,或者类似的方法。
      这里的问题不在于你用什么方法,而是格式错误。正确的格式是本文开头介绍的那样子。

  11. 谢谢博主,但是笨拙哥想说:我还是不懂,还是不懂。。。我的博客至今还没有关键词和网站描述,肿么办?

    • 不知道你什么地方不懂?尝试按照文中的方法一步步来操作,遇到不懂的地方再提问。
      另外,如果问题很多,请到讨论区开个帖子,我们一步步、一点点解决。不能一口吃个胖子对不对。
      如果怕麻烦,可以使用 All-in-One SEO 插件,它会自动帮你处理,虽然不是那么优美。

  12. 引用通告: 再次更新本站发布的 WordPress 描述和关键词 PHP 代码 | 水景一页

  13. 不增加分页判断的话会造成标题(包括描述)重复,这样得不偿失。

    • 多谢提醒,我也考虑过这个问题,还没确认到底是不重复好,还是随便他重复好。实际上我甚至在考虑不显示文章列表了,因为觉得这种分页没什么意义。

  14. 引用通告: 第三次更新水景一页发布的 WordPress 描述和关键词 PHP 代码 | 水景一页

  15. 我想找设置博客关键词与描述的方法,就找到了你的博客。现在却对另外两点感兴趣,如果不是太麻烦的话,能给介绍一下设置方法吗?一个是点击一个词语,自动滑行到下面的段落,这是叫锚点吧?另一个是我发现很多人隐藏了赞助商链接,用本博客链接代替转换。为什么不用赞助商链接呢?
    纠结了半天,还是决定不要直入正题的好,免得到时候有人问这问那,我都忘记了答不上来也是很郁闷的事情:)

    • 1. 锚点的介绍我现编了一篇:http://cnzhx.net/blog/html-links/
      2. 因为有些外部链接不固定,或者太长了,就这样通过程序内部跳转一下呗。

  16. 引用通告: 第四次更新水景一页发布的 WordPress 描述和关键词 PHP 代码 | 水景一页

  17. 小白问博主个问题,看了很多这个关键词描述添加的帖子。大都是直接编辑 header.php
    可以把博主的直接的代码添加到header.php中吗?
    直接添加到后面就可以吗,
    博主的第一行和最后一行不用添加吧?

    添加代码后网页会出错,是这两行代码导致的吗
    <meta charset="” />

    • 这两行代码的关系吗
      [cce]<meta charset="” />
      [/cce]

    • 出错也许是复制代码的时候某些符号变了。
      文中第三部分的结尾有下载,你可以试试看。
      应该不是下面代码的问题。

      • 小白一个,不知道怎么帖代码,我的意思是和主题自带两行代码meta charset= meta name= 有关吗

        另外,博主分享的代码中的开头和结尾两行代码不用插入吧

时间过去太久,评论已关闭。
如果您有话要说,请到讨论区留言并给出此文章链接。
谢谢您的理解 :-)