OGPとTwitter Cardのチートシート

OGP.html

<!-- OGP -->
<meta property="og:url" content="{ url }" />
<meta property="og:type" content="{ website || article || blog || and more url(https://ogp.me/#types) }" />
<meta property="og:title" content="{ page_title } - { site_title }" />
<meta property="og:description" content="{ description }" />
<meta property="og:site_name" content="{ site_name }" />
<meta property="og:image" content="{ image_url }" /><!-- size 1200 * 630 -->
<!-- 確認ツール https://developers.facebook.com/tools/debug/?locale=ja_JP -->

<!-- Twitter Card -->
<meta name=”twitter:card” content="{ summary ||  summary_large_image}" />
<meta name=”twitter:site” content="@{ username }" />
<meta name="twitter:title" content="{ title }">
<meta name="twitter:description" content="{ description }">
<meta name="twitter:image" content="{ image_url }">
<!-- https://cards-dev.twitter.com/validator -->