Skip to content

Instantly share code, notes, and snippets.

@mistakster

mistakster/article.html

Created March 19, 2015 06:19
Show Gist options
  • Save mistakster/2da79fdcc7aada4689af to your computer and use it in GitHub Desktop.
Save mistakster/2da79fdcc7aada4689af to your computer and use it in GitHub Desktop.
Download ZIP
Markup using schema.org types
Raw
article.html
<html itemscope itemtype="http://schema.org/Article">
<head>
<title>Article 3</title>
</head>
<body>
<h1 itemprop="name headline">Article 3</h2>
<div itemprop="articleBody">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
</body>
</html>
Raw
index.html
<html itemscope itemtype="http://schema.org/WebPage">
<head>
<title>My cool articles</title>
</head>
<body>
<h1 itemprop="name">My cool articles</h1>
<article itemscope itemtype="http://schema.org/Article">
<h2 itemprop="name headline">Article 1</h2>
<div itemprop="articleBody">Blah Blah Blah</div>
</article>
<article itemscope itemtype="http://schema.org/Article">
<h2 itemprop="name headline">Article 2</h2>
<div itemprop="articleBody">Foo bar. Foo bar.</div>
</article>
<article itemscope itemtype="http://schema.org/Article">
<h2 itemprop="name headline">Article 3</h2>
<div itemprop="articleBody">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
</article>
</body>
</html>
@mistakster
Copy link
Author

You can review the structure of the markup using Testing tool

Important note:

We don’t need any <article> tag in article.html, because it will break the structure of the outline. Any section element must have heading. So, <article> will steal heading of the document and in this case our document will become untitled.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment