I'm trying to set up a page which can be properly scraped by Facebook when it's shared/liked. The page will have a YouTube video associated with it, so in the content attribute of the og:video tag, should I put the YouTube video embed link or the actual youtube page link for it to appear on Facebook with the little "Preview" button that plays the video in Facebook?
Hope someone can help! Thanks!
What are Open Graph meta tags? Open Graph meta tags are snippets of code that control how URLs are displayed when shared on social media. They're part of Facebook's Open Graph protocol and are also used by other social media sites, including LinkedIn and Twitter (if Twitter Cards are absent).
og:type – The type of content. Think of these as categories, hotel, blog, article etc. Click here for a full list of Open Graph types. og:image – The URL for an image you want to represent the your content. Images must be either PNG, JPEG and GIF formats and at least 50px by 50px.
If you have implemented OG tags in your website and you want to check them. You can go to smallseotools.com and use the OG checker tool. Once you navigate to the website; enter the URL of the website you want the meta og checker tool to check. It will run a check and if it finds the tags it will display them.
Open Graph tags have no direct impact on the page's SEO, but they improve the display and the usability of your links on social media, which is no less essential. Let's take a look at the key Open Graph tags and how to use them.
You have two options. You can either set the og:video
to https://www.youtube.com/v/YOUTUBECODE or set the og:url
to the YouTube page.
In my examples, I'm embedding this video https://www.youtube.com/v/BQBjVr1iHH4 in the following page https://www.keithandthegirl.com/vip/bonus/episode/9/40/this-is-40. I would like Facebook to show the YouTube video whenever anyone shares my page on Facebook.
Option 1: setting the og:video
to https://www.youtube.com/v/YOUTUBECODE
The meta tag will look like
<meta property='og:video' content='https://www.youtube.com/v/BQBjVr1iHH4' />
Notice the structure of the YouTube URL is different than the typical URL. You will need to isolate the "v" query from the YouTube link and use it in the og:video
link format I showed above. In my example, the value of v
is BQBjVr1iHH4
.
Option 2: setting the og:url
to the YouTube page.
If you don't have the ability to isolate the v
code, you can set the og:url
tag to the YouTube page. In my example, it would look like this:
<meta property='og:url' content='https://www.youtube.com/watch?v=BQBjVr1iHH4' />
This will tell Facebook to get the Open Graph tags from https://www.youtube.com/watch?v=BQBjVr1iHH4 and use that in the embed. That means the description and title will come from the YouTube page. However, if someone clicks the link, they'll go to your website.
In my example, if someone pastes the following link while I use the second option https://www.keithandthegirl.com/vip/bonus/episode/9/40/this-is-40 Facebook will see the URL is set to YouTube and query that YouTube link for the OG info. Everything will look like YouTube except the link will click to https://www.keithandthegirl.com/vip/bonus/episode/9/40/this-is-40
One other note: make sure to use https, not http. Facebook will not embed any non-secure video on the site.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With