CLOSE

HTML Open Graph Meta

Open Graph meta tags are used to describe your page for social media. Below are some Open Graph or OG tags.

<!DOCTYPE html>
<html>
    <head>
        <title>My Page With Open Graph Meta</title>
        <meta property="og:title" content="This is the title of my post">
        <meta peroperty="og:description" content="This is the description of my post.">
        <meta property="og:image" content="http://www.exampleimage.com/someimage.jpg">
    </head>
    
    <body>
        Social media is taking over the world.
    </body>
</html>
Expand

With the meta tags above applied to your page, posting your page on social media will display the content of those tags. As an exmple, copy the URL to this page into a Facebook post. You will notice content load into your post. Displaying should be our og:title, og:description and og:image.

These will also display when you place share buttons on your site and a user shares your page. You can try it out with our share buttons above.

Share This Tutorial

Link To This Tutorial

Tutorial URL
https://stepbystephtml.com/tutorial/16/html-advanced-tutorial

HTML Link

Help Us to Help You

This website and it's tutorials are only made possible with your support. Support money goes towards keeping our servers online.

Amount

Link to Us

Spread the word! Let people know about our tutorials by placing links on blogs, websites, forums and other places.

HTML Link

Copyright 2019 Step By Step HTML. All Rights reserved.