Using Schema.org itemprop on Facebook OG meta tags

Asked 27/5, 2014 at 21:14 Answered 17/1, 2019 at 10:11

Solved facebook-opengraph meta schema.org microdata rdfa

Right now I'm using itemprop COMBINED with Facebook Open Graph <meta> tags like the following:

<html class="no-js" itemscope="itemscope" itemtype="http://schema.org/WebPage">
   // ...
  <meta property="og:type" content="website" /> 
  <meta itemprop="name" property="og:title" content="My Title" />
  <meta itemprop="image" property="og:image" content="http://example.com/socialimage.jpg" />
  <meta itemprop="url" property="og:url" content="http://example.com" />
  <meta itemprop="description" property="og:description" content="My description" />
  <meta property="og:site_name" content="My Site"/>

Is this acceptable/valid to do?

Dillman answered 27/5, 2014 at 21:14 Comment(0)

itemprop is defined by Microdata, property is defined by RDFa. So your question is: Can Microdata and RDFa be used on the same meta element?

Yes, as I have explained in a similar (but not identical) question:

When using Microdata on meta, the following attributes are not allowed: name, http-equiv, charset. When using RDFa on meta, these three attributes are optional. In both cases the content attribute is required.

Note that you could stop using Microdata and use RDFa also for Schema.org:

<html typeof="schema:WebPage">
  <!-- … -->
  <meta property="og:type" content="website" /> 
  <meta property="og:title schema:name" content="My Title" />
  <meta property="og:image schema:image" content="http://example.com/socialimage.jpg" />
  <meta property="og:url schema:url" content="http://example.com" />
  <meta property="og:description schema:description" content="My description" />
  <meta property="og:site_name" content="My Site"/>

Also note that you should use link instead of meta when the value is a URL:

  <meta property="og:type" content="website" /> 
  <meta property="og:title schema:name" content="My Title" />
  <link property="og:image schema:image" href="http://example.com/socialimage.jpg" />
  <link property="og:url schema:url" href="http://example.com" />
  <meta property="og:description schema:description" content="My description" />
  <meta property="og:site_name" content="My Site"/>

Elliottellipse answered 28/5, 2014 at 15:38 Comment(1)

I tried, this is not working for Facebook and Twitter until now. They are not parsing RDFa whitespace separated property correctly: ctrl.blog/entry/rdfa-socialmedia-metadata – Acidimetry 11/2, 2019 at 11:11

It looks like it will work, but just to let you know, Google's policy is to ignore hidden markup. So, just something to keep in mind.

Braille answered 28/5, 2014 at 3:42 Comment(0)

Try this Whole code in your Header File: This Script Code for Schema Data:

<script type='application/ld+json'>
        {
            "@context": "http://www.schema.org",
            "@type": "LocalBusiness",
            "name": "website",
            "url": "http://www.website.com/",
            "logo": "http://www.website.com/images/logo.png",
            "image": "http://www.website.com/images/dhaka-city.jpg",
            "title": "Title of your website | website.com",
            "description": "website.com is your online business directory of Country",
            "address": {
                "@type": "PostalAddress",
                "streetAddress": "Road #21, Gulshan, Dhaka, Bangladesh ",
                "addressLocality": "Gulshan",
                "addressRegion": "Dhaka",
                "postalCode": "1200",
                "addressCountry": "Bangladesh"
            },
            "telephone": "+880123456789",
            "geo": {
                "@type": "GeoCoordinates",
                "latitude": "23.783127",
                "longitude": "90.394359"
            },
            "openingHours": "Su, Mo, Tu, We, Th, Fr 09:00-18:00",
            "contactPoint": {
                "@type": "ContactPoint",
                "contactType": "Customer support & query",
                "telephone": "+880123456789"
            }
        }
    </script>

Schema.org markup for Twitter:

<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@website">
<meta name="twitter:creator" content="@website">
<meta property="twitter:url" content="http://www.website.com/" />
<meta name="twitter:title" content="Title of your website | website.com">
<meta name="twitter:description" content="website.com is your online business directory of Country">
<meta name="twitter:image" content="http://www.website.com/images/dhaka-city.jpg">

Open Graph data:

<meta property="og:title" content="Title of your website | website.com"/>
<meta property="og:type" content="Most popular business directory of Bangladesh"/>
<meta property="og:url" content="http://www.website.com/"/>
<meta property="og:image" content="http://www.website.com/images/dhaka-city.jpg"/>
<meta property="og:site_name" content="@website"/>
<meta property="fb:admins" content="Author"/>
<meta property="og:description" content="website.com is your online business directory of Country"/>

Scurrilous answered 17/1, 2019 at 10:11 Comment(0)

Recommended topics

Hot tags