Skip to content

Social Tests

Testing Your Social Media Previews

There are many sites that will check for meta information in your HTML file. The prefix og is for the [Open Graph] standard.

Metatags.io

Open Graph

Social Share Preview

Open Graph Metadata

These elements must be in the html/head section of your document.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<meta  property="og:type"  content="website" >

<meta  property="og:title"  content="Social Image Preview Override From Markdown Metadata v18 - Mkdocs Material Social Card Testing" >

<meta  property="og:description"  content="A custom description for this page." >

<meta  property="og:image"  content="https://dmccreary.github.io/mkdocs-material-social/assets/images/social/metadata-override-test.png" >

<meta  property="og:image:type"  content="image/png" >

<meta  property="og:image:width"  content="1200" >

<meta  property="og:image:height"  content="630" >

<meta  property="og:url"  content="https://dmccreary.github.io/mkdocs-material-social/metadata-override-test/" >

<meta  name="twitter:card"  content="summary_large_image" >

<meta  name="twitter:title"  content="Social Image Preview Override From Markdown Metadata v18 - Mkdocs Material Social Card Testing" >

<meta  name="twitter:description"  content="A custom description for this page." >

<meta  name="twitter:image"  content="https://dmccreary.github.io/mkdocs-material-social/assets/images/social/metadata-override-test.png" >