Blog Platform — Features Demo
This article is a live demonstration of the blog platform's capabilities.
Markdown
Posts are written in standard Markdown. Headings, bold, italic, inline code, blockquotes, and fenced code blocks all render as expected.
const greet = (name: string): string => `Hello, ${name}!`
console.log(greet("World")) // → Hello, World!
Inline Snippets
A snippet tag renders as a live iframe constrained to the prose column. The iframe auto-sizes to its content height.
Theme-Aware Snippets
Snippets that use var(--sn-*) adapt to the site theme automatically. Every snippet receives a data-theme attribute and a live postMessage when the theme is toggled. Toggle the theme button in the nav and watch the card below update without reloading.
User Context in Snippets
Every snippet also receives the current viewer's identity as window.__sn_user. If you are logged in it contains { id, username, role }; if not, it is null. The value is set before the snippet's own JS runs, and any subsequent login or logout on the same page fires an sn:userchange DOM event so snippets can react live.
Log in or register using the comment section at the bottom of this article, then scroll back up and watch the card below update.
This is useful for personalised demos, gated content previews, role-based UI examples, or any interactive snippet that needs to know who it is talking to.
Multi-Tab Snippets
Group related demos into tabs. Each tab is a fully isolated iframe.
Tabs are always hidden for single-snippet embeds. Use the notabs flag to suppress the tab bar explicitly:
Full-Bleed Snippets
Add wide to let a snippet span the full viewport width, breaking out of the prose column.
Multi-Tab + Full-Bleed
Series & Theming
Every post belongs to a series. Series nest arbitrarily, each carrying a themeClass applied to its page header. The tree supports expand/collapse and ascending/descending sort.
Post Voting & Threaded Comments
Authenticated readers can upvote posts and leave threaded comments. Votes are de-duplicated per user. Scroll down to try it — logging in here will update the User Context snippet above in real time.
Admin Workflow
There is no visible admin link on the public site. The entry path is a configurable environment variable and can also be triggered via a keyboard shortcut. The dashboard has full CRUD for posts, series, and snippets.