For Social Media Optimization (SMO), Alpha automatically generates OpenGraph and Twitter cards for each page.
Both determine how your content will appear when it’s shared on social platforms, ensuring consistent and accurate previews.
A Single Image for All Platforms
Both OpenGraph and Twitter Cards use the same image, controlled by the seo_image = "" frontmatter key (or the global seo_default_image = "" in your config/_default/params.toml).
- Recommended Dimensions:
1200×630px - Alpha will automatically resize images to this standard when possible. If an image has a different aspect ratio, the original will be used, and LiVa will alert you during local development.
OpenGraph
Like Schema, OpenGraph is populated by frontmatter values. Simply fill the appropriate keys your content needs, and Alpha will generate the OpenGraph for your page.
A complete generated OpenGraph example for a content page looks like this:
<meta property="og:title" content="[Page Title]" />
<meta property="og:description" content="[Page Description]" />
<meta property="og:url" content="[Page URL]" />
<meta property="og:site_name" content="[Site Title]" />
<meta property="og:type" content="[website or article]" />
<meta property="article:author" content="[Page Author URL]" />
<meta property="article:published_time" content="[Published Date]" />
<meta property="article:modified_time" content="[Modified Date]" />
<meta property="og:locale" content="[Language]" />
<meta property="og:locale:alternate" content="[Alternate Language]" />
<meta property="og:image" content="[SEO Image]" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
Article Author
In OpenGraph, the article:author value should not be the author name but the URL of the author’s profile on a social platform (usually Facebook or LinkedIn).
Add your social profile page URL to seo_author_url = "" in config/_default/params.toml, or override it per page with a seo_author_url = "" key in the frontmatter.
Twitter Cards
Twitter Cards are used exclusively when your page is shared on X.
Values are also filled by the corresponding frontmatter keys.
- If a
seo_imageis defined, asummary_large_imagecard is used. - If not, a
summarycard is used.
A complete generated Twitter card (with image) looks like this:
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="[SEO Image]">
<meta name="twitter:url" content="[Page URL]" />
<meta name="twitter:title" content="[Page Title]" />
<meta name="twitter:description" content="[Page Description]" />
<meta name="twitter:site" content="@[Twitter Username]" />
<meta name="twitter:creator" content="@[Twitter Username]" />
Site/Creator
For single-author sites, set seo_twitter_username = "" in config/_default/params.toml and both twitter:site and twitter:creator will be populated automatically.
To override only the twitter:creator value for a specific page, add seo_twitter_username = "" to that page’s frontmatter.