Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Example of blockquote with cite + schema.org
<blockquote cite="https://twitter.com/aaronbassett/status/84037182196678658">
<p>I had ice-cream tonight. It was awesome.</p>
<footer itemscope itemtype="http://schema.org/Person">
— <a href="https://twitter.com/aaronbassett" itemprop="url"><span itemprop="name">Aaron Bassett</span></a>
on <cite><a href="https://twitter.com/aaronbassett/status/84037182196678658">Twitter</a></cite>
</footer>
</blockquote>
@oli

This comment has been minimized.

Show comment Hide comment
@oli

oli Jun 29, 2011

Thanks for the code sample Aaron! Here’s what I changed:

  • https://twitter.com/ for the link in the &lt;cite> element doesn’t provide context for the block quote. Linking to the actual tweet does
  • Adding a &lt;span itemprop="name"> lets us use itemprop="url". I feel that indicating just a name isn’t really that worthwhile, but add a link and it’s something worth adding to your address book etc. You could also throw in rel="me" on the &lta> ;)
  • This snippet also works fine if you change itemtype="http://schema.org/Person" to itemtype="http://microformats.org/profile/hcard", as name and url are equivalent in those schemas.

Thanks again, and please link to your gist in the article comments!

Owner

oli commented Jun 29, 2011

Thanks for the code sample Aaron! Here’s what I changed:

  • https://twitter.com/ for the link in the &lt;cite> element doesn’t provide context for the block quote. Linking to the actual tweet does
  • Adding a &lt;span itemprop="name"> lets us use itemprop="url". I feel that indicating just a name isn’t really that worthwhile, but add a link and it’s something worth adding to your address book etc. You could also throw in rel="me" on the &lta> ;)
  • This snippet also works fine if you change itemtype="http://schema.org/Person" to itemtype="http://microformats.org/profile/hcard", as name and url are equivalent in those schemas.

Thanks again, and please link to your gist in the article comments!

@inetbiz

This comment has been minimized.

Show comment Hide comment
@inetbiz

inetbiz Mar 12, 2017

I think I figured it out?

<figure itemid="https://www.pinterest.com/pin/201887995769400347/" itemscope itemtype="http://schema.org/SocialMediaPosting">
 <a href="https://www.pinterest.com/pin/201887995769400347/"><img src="..." itemprop="image" / alt="Leaked new BMW 2 series (m235i)"></a>
  <blockquote cite="https://www.pinterest.com/pin/201887995769400347/">
  <h1 itemprop="headline">Leaked new BMW 2 series (m235i)</h1>
  <p>Date posted: March 4, 2014 <meta itemprop="datePublished" content="2014-03-04" /></p>
  <p>Author:
    <span itemprop="author" itemscope itemtype="http://schema.org/Person">
      <span itemprop="name">
        <a itemprop="url" href="https://www.pinterest.com/ryansammy/">Ryan Sammy</a></span>
    </span>
  </p>
  <figcaption itemprop="sharedContent" itemscope itemtype="http://schema.org/WebPage">
      <footer>
      <p>
        <cite><b itemprop="headline"><a itemprop="url citation" href="http://www.reddit.com/r/BMW/comments/1oyh6j/leaked_new_bmw_2_series_m235i_ahead_of_oct_25/">
          Leaked new BMW 2 series (m235i) ahead of oct 25 reveal</a></b></cite>
      </p>
      <p>Author: 
        <span itemprop="author" itemscope itemtype="http://schema.org/Person">
          <span itemprop="name">threal135i</span>
        </span>
      </p>
      </footer>
  </figcaption>
  </blockquote>
</figure>

inetbiz commented Mar 12, 2017

I think I figured it out?

<figure itemid="https://www.pinterest.com/pin/201887995769400347/" itemscope itemtype="http://schema.org/SocialMediaPosting">
 <a href="https://www.pinterest.com/pin/201887995769400347/"><img src="..." itemprop="image" / alt="Leaked new BMW 2 series (m235i)"></a>
  <blockquote cite="https://www.pinterest.com/pin/201887995769400347/">
  <h1 itemprop="headline">Leaked new BMW 2 series (m235i)</h1>
  <p>Date posted: March 4, 2014 <meta itemprop="datePublished" content="2014-03-04" /></p>
  <p>Author:
    <span itemprop="author" itemscope itemtype="http://schema.org/Person">
      <span itemprop="name">
        <a itemprop="url" href="https://www.pinterest.com/ryansammy/">Ryan Sammy</a></span>
    </span>
  </p>
  <figcaption itemprop="sharedContent" itemscope itemtype="http://schema.org/WebPage">
      <footer>
      <p>
        <cite><b itemprop="headline"><a itemprop="url citation" href="http://www.reddit.com/r/BMW/comments/1oyh6j/leaked_new_bmw_2_series_m235i_ahead_of_oct_25/">
          Leaked new BMW 2 series (m235i) ahead of oct 25 reveal</a></b></cite>
      </p>
      <p>Author: 
        <span itemprop="author" itemscope itemtype="http://schema.org/Person">
          <span itemprop="name">threal135i</span>
        </span>
      </p>
      </footer>
  </figcaption>
  </blockquote>
</figure>
@inetbiz

This comment has been minimized.

Show comment Hide comment
@inetbiz

inetbiz Mar 12, 2017

Could I remove the headline H1 and add a property inside the figcaption for headline?

inetbiz commented Mar 12, 2017

Could I remove the headline H1 and add a property inside the figcaption for headline?

@inetbiz

This comment has been minimized.

Show comment Hide comment
@inetbiz

inetbiz Mar 12, 2017

Maybe this iteration is better? Still experimenting....

<figure itemid="https://www.pinterest.com/pin/201887995769400347/" itemscope itemtype="http://schema.org/SocialMediaPosting">
<link itemtype="headline" itemref="#headline" />
 <img src="..." itemprop="image" />
  <blockquote cite="https://www.pinterest.com/pin/201887995769400347/">
  <h3 itemprop="headline">Leaked new BMW 2 series (m235i) ahead of oct 25 reveal</h3>
  <p>Date posted: March 4, 2014 <meta itemprop="datePublished" content="2014-03-04" /></p>
  <p>Author:
    <span itemprop="author" itemscope itemtype="http://schema.org/Person">
      <span itemprop="name">
        <a itemprop="url" href="https://www.pinterest.com/ryansammy/">Ryan Sammy</a></span>
    </span>
  </p>
  <figcaption itemprop="sharedContent" itemscope itemtype="http://schema.org/WebPage">
      <footer>
      <p>
        <cite><b itemprop="name"><a itemprop="url citation" href="http://www.reddit.com/r/BMW/comments/1oyh6j/leaked_new_bmw_2_series_m235i_ahead_of_oct_25/">
          Leaked new BMW 2 series (m235i) ahead of oct 25 reveal</a></b></cite>
      </p>
      <p>Author: 
        <span itemprop="author" itemscope itemtype="http://schema.org/Person">
          <span itemprop="name">threal135i</span>
        </span>
      </p>
      </footer>
  </figcaption>
  </blockquote>
</figure>

inetbiz commented Mar 12, 2017

Maybe this iteration is better? Still experimenting....

<figure itemid="https://www.pinterest.com/pin/201887995769400347/" itemscope itemtype="http://schema.org/SocialMediaPosting">
<link itemtype="headline" itemref="#headline" />
 <img src="..." itemprop="image" />
  <blockquote cite="https://www.pinterest.com/pin/201887995769400347/">
  <h3 itemprop="headline">Leaked new BMW 2 series (m235i) ahead of oct 25 reveal</h3>
  <p>Date posted: March 4, 2014 <meta itemprop="datePublished" content="2014-03-04" /></p>
  <p>Author:
    <span itemprop="author" itemscope itemtype="http://schema.org/Person">
      <span itemprop="name">
        <a itemprop="url" href="https://www.pinterest.com/ryansammy/">Ryan Sammy</a></span>
    </span>
  </p>
  <figcaption itemprop="sharedContent" itemscope itemtype="http://schema.org/WebPage">
      <footer>
      <p>
        <cite><b itemprop="name"><a itemprop="url citation" href="http://www.reddit.com/r/BMW/comments/1oyh6j/leaked_new_bmw_2_series_m235i_ahead_of_oct_25/">
          Leaked new BMW 2 series (m235i) ahead of oct 25 reveal</a></b></cite>
      </p>
      <p>Author: 
        <span itemprop="author" itemscope itemtype="http://schema.org/Person">
          <span itemprop="name">threal135i</span>
        </span>
      </p>
      </footer>
  </figcaption>
  </blockquote>
</figure>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment