Early Access
Social Share
Get Started
<meta property="og:url" content="https://example.com/page.html">
<meta property="og:title" content="The Ultimate Guide to Freshwater Fishing">
<meta property="og:description" content="Discover the top 10 SEO strategies to boost your website's traffic in 2023. Click to learn more!">
<meta property="og:type" content="article">
<meta property="og:locale" content="en_US">
<meta property="og:site_name" content="ExampleCorp">
<meta property="og:image" content="https://example.com/og-image.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="600">
<meta property="og:image:alt" content="Team collaborating on a web development project">
<meta name="twitter:image" content="https://example.com/path/to/image.jpg">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:creator" content="@contentcreator">
<meta name="twitter:site" content="@exampleUser">
<meta name="twitter:label1" content="Author">
<meta name="twitter:data1" content="42K Tweets">
<meta name="twitter:label2" content="Location">
<meta name="twitter:data2" content="30 mins">
Explanation
og:url
Defines the canonical URL of your page that will be used as its permanent ID in the graph. It's crucial for ensuring content consistency across sharing on social platforms.
<meta property="og:url" content="https://example.com/page.html">
og:title
Defines the title of your content as you want it to appear when shared on social platforms. The og:title meta tag is part of the Open Graph protocol and is crucial for social media SEO, as it determines the title text that appears when a page is shared on social platforms like Facebook, LinkedIn, and Twitter.
<meta property="og:title" content="The Ultimate Guide to Freshwater Fishing">
og:description
Defines the description of your content as you want it to appear when shared on social platforms like Facebook, LinkedIn, and others that adhere to the Open Graph protocol.
<meta property="og:description" content="Discover the top 10 SEO strategies to boost your website's traffic in 2023. Click to learn more!">
og:type
Defines the type of content being shared on social media platforms, such as articles, videos, or images. This tag helps social platforms understand and display the content in the most appropriate format.
<meta property="og:type" content="article">
og:locale
Defines the locale of the page content. This tag helps social media platforms and other services understand the language and regional settings to use when displaying or categorizing the shared content.
<meta property="og:locale" content="en_US">
og:site_name
Indicates the name of your website that should be displayed within the context of the shared content on social media platforms. It helps reinforce brand consistency across various social networks.
<meta property="og:site_name" content="ExampleCorp">
og:image
Defines the image that appears when a web page is shared on social media platforms. It ensures the shared content is visually appealing and contextually relevant, enhancing click-through rates from social shares.
<meta property="og:image" content="https://example.com/og-image.jpg">
og:image:width
Specifies the width of the image used in the Open Graph protocol, helping social media platforms and other services understand the dimensions of the image to properly display it when the page is shared.
<meta property="og:image:width" content="1200">
og:image:height
Specifies the height of the image in pixels used when sharing the page on social media platforms like Facebook. This helps the platform allocate the correct space for the image before it's fully loaded.
<meta property="og:image:height" content="600">
og:image:alt
Provides alternative text for the image specified by og:image, ensuring it is accessible and descriptive of the image content for scenarios where the image cannot be displayed.
<meta property="og:image:alt" content="Team collaborating on a web development project">
twitter:image
Defines the image to be used when the webpage is shared on Twitter. It influences the visual representation of shared content, enhancing user engagement.
<meta name="twitter:image" content="https://example.com/path/to/image.jpg">
twitter:card
Defines the type of content represented on the page to create a rich media experience when the page is shared on Twitter.
<meta name="twitter:card" content="summary_large_image">
twitter:creator
Defines the Twitter username of the content creator to be displayed as part of Twitter Card metadata.
<meta name="twitter:creator" content="@contentcreator">
twitter:site
Defines the Twitter username of the website or the content creator. This username is displayed in Twitter cards associated with the website or content to indicate the source. It begins with an @ symbol.
<meta name="twitter:site" content="@exampleUser">
twitter:label1
Used within Twitter card metadata to define the label for data displayed in tweet cards generated from shared URLs. It's typically used in conjunction with `twitter:data1` to showcase specific types of information, enhancing social sharing.
<meta name="twitter:label1" content="Author">
twitter:data1
Part of Twitter Cards, used to define extra data that will be visually presented in the card. Often used to provide additional context like statistics, or relevant information that can enhance the user’s understanding at a glance.
<meta name="twitter:data1" content="42K Tweets">
twitter:label2
Defines the label for the second data point displayed in a Twitter Card, often used alongside "twitter:data2" to provide additional context or information.
<meta name="twitter:label2" content="Location">
twitter:data2
Used in Twitter Cards to provide additional data points or context relevant to the content shared on Twitter, enhancing the information displayed in the card.
<meta name="twitter:data2" content="30 mins">
HTML Tag Collections
Ready to use <head> code samples to get started, and finished quickly.
Community