我无法理解您对“隐藏”的定义。
我不明白你为什么要从搜索引擎抓取的网站中隐藏有价值的、相关的内容,所以我假设你的意思是从结构化测试工具中隐藏。
由于您只提供了一段代码,因此很难知道您已经编写了什么。
标记
首先,在理想情况下,您希望使用article
标签来标记您的文章。
您的标记现在应该结构如下:
<article itemscope itemtype="http://schema.org/Article">
<header>
<h1 itemprop="headline">Blog Title</h1>
<time datetime="2016-10-03">03 September 2016</time>
</header>
<div itemprop="articleBody">
<p>The article element represents a self contained article or document.</p>
<div class="related">list of related posts</div>
</div>
</article>
出于以下原因,您应该将相关内容从 中取出,<div itemprop="articleBody">
并将其放在<aside>
中。<article>
的定义aside
HTML 元素代表页面的一部分,其内容与其余部分相切,可以认为与该内容分开。这些部分通常表示为侧边栏或插入。它们通常包含边栏上的定义,例如词汇表中的定义;也可能有其他类型的信息,例如相关广告;作者的传记;网络应用程序;个人资料信息或博客上的相关链接。
来源 - Mozilla 开发者网络
的使用aside
当在文章元素中使用时,内容应该与该文章特别相关(例如,词汇表)。当在文章元素之外使用时,内容应该与站点相关(例如,博客、附加导航组,如果内容与页面相关,甚至是广告)。
来源 -除了重新访问
您的标记现在应该包含一个<aside>
并且结构如下:
<article itemscope itemtype="http://schema.org/Article">
<header>
<h1 itemprop="headline">Blog Title</h1>
<time datetime="2016-10-03">03 September 2016</time>
</header>
<div itemprop="articleBody">
<p>The article element represents a self contained article or document.</p>
</div>
<aside class="related">
<header>
<h2>Related content</h2>
</header>
</aside>
</article>
验证
为了通过 Google 结构化数据测试工具的验证,您需要为文章添加更多信息。
您可以拥有:
- 标记(可见,推荐)
- 使用
<meta itemprop="name" content="content" />
(隐形)
例如:
<span itemprop="author">John Doe</span>
<meta itemprop="author" content="content" />
Route 1 是首选,因为您可以使用相关架构标记它们,在本例中为Person
完整标记
我已经添加了所需的HTML/Schema 以通过 Google 结构化数据测试工具的验证。
<article itemscope itemtype="http://schema.org/Article">
<header>
<h1 itemprop="headline">Blog Title</h1>
<time itemprop="datePublished" datetime="2016-10-03">03 September 2016</time>
<p itemprop="author" itemscope itemtype="http://schema.org/Person">
<span itemprop="name">John Doe</span>
</p>
<div itemprop="publisher" itemscope itemtype="https://schema.org/Organization">
<div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
<img src="http://placekitten.com/200/50" alt=""/>
<meta itemprop="url" content="http://placekitten.com/200/50">
<meta itemprop="width" content="200">
<meta itemprop="height" content="50">
</div>
<meta itemprop="name" content="Blog name">
</div>
</header>
<div itemprop="articleBody">
<div itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
<img src="http://placekitten.com/300/300" alt="Kitten, cute kitten"/>
<meta itemprop="url" content="http://placekitten.com/300/300">
<meta itemprop="width" content="300">
<meta itemprop="height" content="300">
</div>
<p>The article element represents a self contained article or document.</p>
</div>
<aside class="related">
<header>
<h2>Related content</h2>
</header>
</aside>
</article>
Codepen 演示
已验证