BlakePlugin.OpenGraph
1.0.0
dotnet add package BlakePlugin.OpenGraph --version 1.0.0
NuGet\Install-Package BlakePlugin.OpenGraph -Version 1.0.0
<PackageReference Include="BlakePlugin.OpenGraph" Version="1.0.0" />
<PackageVersion Include="BlakePlugin.OpenGraph" Version="1.0.0" />
<PackageReference Include="BlakePlugin.OpenGraph" />
paket add BlakePlugin.OpenGraph --version 1.0.0
#r "nuget: BlakePlugin.OpenGraph, 1.0.0"
#:package BlakePlugin.OpenGraph@1.0.0
#addin nuget:?package=BlakePlugin.OpenGraph&version=1.0.0
#tool nuget:?package=BlakePlugin.OpenGraph&version=1.0.0
Blake OpenGraph Plugin (per‑route shells for social previews)
Add correct Open Graph tags to every Blake‑generated page without SSR, prerender, or edge functions. The plugin emits a small, standalone HTML "shell" per page at /.../index.html
so social scrapers (which don’t run JS) get the right <head>
on first byte.
Scope: only pages Blake generates from markdown. The site’s home page (wwwroot/index.html
) is not modified.
What does it do
Blazor WASM (and most SPAs) inject <HeadContent>
after the app boots. Social bots (Facebook, X/Twitter, LinkedIn, Slack, Discord, etc.) don’t execute JS, so they miss your OG tags. This plugin solves that by baking a per‑route HTML shell containing the correct meta, while retaining the Blazor UX.
- Reads existing shell from
wwwroot/index.html
. - Builds a compact SEO/social
<head>
block per content page (title, description, canonical,og:*
). - Writes a per‑page shell to
wwwroot/<slug>/index.html
. - Leaves your home page and the rest of your app untouched.
Result:
- Bots fetch
/posts/my-post/
and receive a real HTML file with the correct<head>
immediately. - Humans (browsers) fetch the same URL and your Blazor app boots as normal.
Installation
Add the plugin to your Blake site
dotnet add package BlakePlugin.OpenGraph
Bake with the required options (see Configuration). Example:
blake bake --social:baseurl="https://example.com"
Note: You can omit the base URL argument in debug, but the plugin will not be able to generate absolute URLs for your Open Graph tags so you should include this in any CI builds.
The plugin writes files directly into your project’s wwwroot/
so they’ll be included by dotnet build
and whatever static host you use.
Configuration
Required (Production):
--social:baseurl
: Full origin used to build absolute URLs forog:url
,og:image
, andcanonical
.- Examples:
https://example.com
,https://user.github.io/repo
- Examples:
Output
For each generated page, the plugin writes:
wwwroot/
posts/
post-title/
index.html <-- shell with correct <head> (OG/Twitter/canonical)
The shell links to your existing CSS/JS; only the <head>
differs per page.
The home page (
wwwroot/index.html
) is not altered by this plugin.
Meta set the plugin emits
The plugin uses Blake standard frontmatter so there is no additional configuration required.
# example.md
---
title: "Post title"
description: "Short summary for cards"
image: "/images/og/post-title.png" # optional; plugin makes absolute via baseurl
tags: ["example", "post"]
...etc.
---
The plugin emits the following meta tags for each generated page:
<title>
- mapped from thetitle
in frontmatter<meta name="description">
- mapped from thedescription
in frontmatter<link rel="canonical" href="ABSOLUTE_URL">
- built from the page URL combined with thebaseurl
<meta property="og:type" content="article">
(content pages)<meta property="og:title">
- mapped from thetitle
in frontmatter<meta property="og:description">
- mapped from thedescription
in frontmatter<meta property="og:url" content="ABSOLUTE_URL">
- built from the page URL combined with thebaseurl
<meta property="og:image" content="ABSOLUTE_URL">
- built from theimage
in frontmatter (if present, omitted if not)
Values are HTML‑escaped; URLs are normalized and made absolute using baseurl
.
Validation checklist
Curl:
curl -s https://example.com/posts/post-title/ | grep -i "og:"
Debuggers: use Facebook Sharing Debugger, X Card Validator, and LinkedIn Post Inspector to refresh caches and verify cards.
Image: ensure your OG image returns 200, has proper
Content-Type
, is ≥ 1200×630, and < ~5 MB.
Troubleshooting
- Missing per‑route file: confirm the page’s
slug
and that the plugin ran duringblake bake
. - Wrong URLs (nested paths): set
--social:baseurl
or use rooted links in your app. - Double slashes: the plugin normalizes common
//
patterns; still prefer clean paths in front‑matter. - No previews: some platforms cache aggressively—use their debuggers to “scrape again.”
Limitations (by design)
- The plugin only emits meta in the head. It does not SSR your page body.
- The site home page is not modified (ensure you add your own meta tags there).
- The plugin only handles Open Graph tags (i.e. no Twitter Cards).
Product | Versions Compatible and additional computed target framework versions. |
---|---|
.NET | net9.0 is compatible. net9.0-android was computed. net9.0-browser was computed. net9.0-ios was computed. net9.0-maccatalyst was computed. net9.0-macos was computed. net9.0-tvos was computed. net9.0-windows was computed. net10.0 was computed. net10.0-android was computed. net10.0-browser was computed. net10.0-ios was computed. net10.0-maccatalyst was computed. net10.0-macos was computed. net10.0-tvos was computed. net10.0-windows was computed. |
-
net9.0
- Blake.BuildTools (>= 1.0.18)
NuGet packages
This package is not used by any NuGet packages.
GitHub repositories
This package is not used by any popular GitHub repositories.
Version | Downloads | Last Updated |
---|---|---|
1.0.0 | 147 | 8/19/2025 |