post

实现 Google 丰富网页摘要

Google 的丰富网页摘要实现起来很简单,可以在搜索结果中显示结构化的数据,如面包屑、相关链接、评分和价格范围、专辑中各首歌曲等。这些丰富网页摘要可帮助用户了解您的网站与他们的搜索内容是否相关,并可能让您的网页获得更多点击次数。

之前我的一篇文章介绍了在 Google 搜索结果中显示作者头像的方法,今天再介绍下如何实现在 Google 搜索结果中显示目录分类摘要。

看下效果:

Google 丰富网页摘要

WordPress 博客可以将下面的代码放到主题的 single.php 的相应位置,由于我的博客代码不太好改,为了方便,我直接把内容输出到页面中,并且隐藏了,不需要的将下面代码中 display:none; 更改为 display:inline;

显示目录分类摘要:

<?php 
$separator = '&rsaquo;';
$category = get_the_category();
if ($category) {
	foreach($category as $category) {
		echo '<div class="google-breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb" style="display:none;">';
		echo $separator . "<a href=\"".get_category_link($category->term_id)."\" itemprop=\"url\"><span itemprop=\"title\">$category->name</span></a>";
		echo '</div>';
	}
}
?>

显示文章第一个标签摘要:

<?php 
$tags = get_the_tags(); 
if ($tags) {
	$tag = $tags[0]; 
	echo '<div class="google-breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb" style="display:none;">';
	echo "<a href=\"".get_tag_link($tag->term_id)."\" itemprop=\"url\"><span itemprop=\"title\">$tag->name</span></a>";
	echo '</div>';
}
?>

在博客中加好后,可以使用 Google 结构化数据测试工具 验证一下结果。

注意验证后的最底部,出现下面的数据就正常了,我当时只有一个分类,没有效果,所以我又在分类后面加上了第一个标签。

Item 
    type:	http://data-vocabulary.org/breadcrumb
    property:	
    url:	编程
    title:	编程

Google 官方介绍:https://support.google.com/webmasters/answer/99170?hl=zh-Hans

Speak Your Mind

*

· 209 次浏览