This skill should be used when the user asks to "write a blog post", "draft a blog post", "create a technical blog", "write a deep dive", "write an explainer", "blog about", "write a tutorial post", "turn this into a blog post", or wants to create technical content for a personal blog or static site. Default platform is Jekyll (Gundersen-style) with KaTeX math, BibTeX citations via jekyll-scholar, and custom figure HTML. Covers deep dives, explainers, tutorials, and project showcases on ML, statistics, computer science, finance, math, and quantitative topics. Generates Markdown with SEO frontmatter, code examples, and diagram suggestions.
Creates technical blog posts in Jekyll Markdown with KaTeX math, verified citations, and SEO frontmatter for deep dives and tutorials.
npx claudepluginhub luqmannurhakimbazman/ashfordThis skill inherits all available tools. When active, it can use any tool Claude has access to.
references/citation-workflow.mdreferences/diagrams.mdreferences/gundersen-style-cards.mdreferences/jekyll-setup.mdreferences/seo-frontmatter.mdreferences/sources.mdreferences/style-rubric.mdreferences/writing-patterns.mdProduce publication-ready technical blog posts as Markdown files. The default platform is a Gundersen-style Jekyll blog with KaTeX math, jekyll-scholar citations, and custom HTML figures. For other platforms (Hugo, Astro, Next.js), consult references/seo-frontmatter.md for platform-specific frontmatter and conventions.
Blog writing is collaborative, but Claude should be proactive in delivering drafts.
The typical workflow starts with a topic, a codebase, a paper, or a vague idea. Claude's role is to:
Key Principle: Be proactive. If the topic and angle are clear, deliver a full draft. Don't block waiting for feedback on every section — authors are busy. Produce something concrete they can react to, then iterate based on their response.
Default: Be proactive. Deliver drafts, then iterate.
| Confidence Level | Action |
|---|---|
| High (clear topic, obvious angle) | Write full draft, deliver, iterate on feedback |
| Medium (some ambiguity) | Write draft with flagged uncertainties, continue |
| Low (major unknowns) | Ask 1-2 targeted questions, then draft |
Draft first, ask with the draft (not before):
| Section | Draft Autonomously | Flag With Draft |
|---|---|---|
| Outline | Yes | "Framed as deep dive — adjust if you prefer tutorial" |
| Opening | Yes | "Emphasized problem X — correct if wrong angle" |
| Body sections | Yes | "Included sections A, B, C — reorder if needed" |
| Code examples | Yes | "Used Python — switch to R/Julia if preferred" |
| Citations | Yes | "Cited papers X, Y, Z — add any I missed" |
Only block for input when:
This is the most important rule in blog writing with AI assistance.
AI-generated citations have a ~40% error rate. Hallucinated references — papers that don't exist, wrong authors, incorrect years, fabricated DOIs — are a serious credibility problem. Blog posts persist indefinitely with no retraction process, and readers propagate errors by citing your post in their own work.
NEVER generate BibTeX entries from memory. ALWAYS fetch programmatically.
| Action | Correct | Wrong |
|---|---|---|
| Adding a citation | Search API → verify → fetch BibTeX | Write BibTeX from memory |
| Uncertain about a paper | Mark as PLACEHOLDER | Guess the reference |
| Can't find exact paper | Note: "placeholder — verify" | Invent similar-sounding paper |
Use an explicit placeholder pattern so the author knows to check:
{% cite PLACEHOLDER_author2024_verify %}
<!-- TODO: Could not verify this citation exists. Please confirm before publishing. -->
Always tell the author: "I've marked [X] citations as placeholders that need verification. I could not confirm these references exist."
For the complete citation verification workflow, see references/citation-workflow.md.
These rules prevent the most common rendering failures. Every rule was learned from real broken builds.
| # | Rule | Why |
|---|---|---|
| 1 | Wrap entire post body in {% katexmm %}...{% endkatexmm %} | KaTeX won't render $...$ or $$...$$ without it |
| 2 | Do NOT include {% bibliography --cited %} in posts | The layout renders the bibliography automatically — including it creates duplicates |
| 3 | Image paths use /image/{post-slug}/ | Other paths (e.g., /assets/, relative paths) break on the live site |
| 4 | Number figures by narrative order | First figure referenced in text = Figure 1, regardless of creation order |
| 5 | No CSS classes in post HTML | The site stylesheet handles all styling — custom classes in posts cause conflicts |
| 6 | Never modify site infrastructure | Only touch _posts/, _bibliography/, image/ — never _layouts/, _includes/, css/, _config.yml |
The entire post body (everything after the YAML frontmatter) must be wrapped in {% katexmm %}...{% endkatexmm %}. This enables $...$ for inline math and $$...$$ for display math throughout the post.
---
title: "Post Title"
layout: default
date: 2024-03-15
---
{% katexmm %}
Your entire post content goes here. Inline math like $x^2$ and display math:
$$\mathcal{L}(\theta) = \sum_{i=1}^{N} \log p(x_i \mid \theta) \tag{1}$$
All math works because the whole post is inside the katexmm block.
{% endkatexmm %}
Do NOT use individual {% katex %}...{% endkatex %} blocks — they are legacy/alternative syntax. The katexmm wrapper is simpler and prevents missed math blocks. MathJax is legacy; KaTeX is the active renderer.
The site's default.html layout already includes the bibliography rendering logic. Adding {% bibliography --cited %} to a post body causes a duplicate bibliography at the bottom of the page.
Correct: Just use {% cite key %} inline. The bibliography appears automatically.
Wrong: Adding {% bibliography --cited %} at the end of the post.
Number figures by the order they are first referenced in the text, not by the order they were created or appear in a source document.
| First reference in text | Figure number |
|---|---|
| "Consider [this diagram], which shows..." | Figure 1 |
| "As shown in [this plot]..." | Figure 2 |
| "[This table] compares..." | Figure 3 |
The <div class='caption'> must appear immediately after the <img> tag, inside the same <div class='figure'> container.
Blog post generation should only create or modify files in:
_posts/ — the post Markdown file_bibliography/ — BibTeX entries for citationsimage/ — figures and diagramsNever suggest changes to _layouts/, _includes/, css/, _config.yml, or any other site infrastructure files. If something seems broken in the rendering, the post content is wrong — not the site.
When the user provides a codebase, paper, library, or project as source material, start here before the Core Workflow.
Source Material Workflow:
- [ ] Step 1: Explore the source material
- [ ] Step 2: Identify the blog angle
- [ ] Step 3: Confirm angle and audience with user
- [ ] Step 4: Find citations in source material
- [ ] Step 5: Search for additional references
- [ ] Step 6: Proceed to Core Workflow Step 2 (outline)
Understand what you're working with:
# For a codebase
ls -la
find . -name "*.py" -o -name "*.rs" -o -name "*.ts" | head -20
find . -name "README*" -o -name "*.md" | head -10
# For a paper or PDF
# Read the abstract, introduction, and conclusion first
# For a library
# Read the README, check examples/, look at core API
Look for:
README.md — Project overview and key claimsexamples/, notebooks/ — Demonstrations of the concepttests/ — Edge cases and expected behavior.bib files or citation referencesAsk: "What would Gundersen write about this?" The best Gundersen-style posts:
Candidate angles:
Present your proposed framing:
"Based on the source material, I propose writing a [deep dive/explainer/tutorial] on [specific angle]. The target reader would be [audience level]. The key takeaway: [one sentence]. Should I proceed with this framing?"
Then proceed with the draft. Don't wait for confirmation unless the angle is genuinely ambiguous.
Check for papers already referenced:
# Find existing citations in codebase
grep -r "arxiv\|doi\|cite\|reference" --include="*.md" --include="*.bib" --include="*.py" --include="*.rs"
find . -name "*.bib"
These are high-signal starting points — the author has already deemed them relevant.
Use Exa MCP (if available) or web search to find supporting references:
Search queries to try:
- "[main concept] tutorial" or "[main concept] explained"
- "[concept] original paper"
- "[concept] textbook reference"
- Author names from existing citations
Then verify and retrieve BibTeX using the workflow in references/citation-workflow.md.
With the angle confirmed and citations gathered, skip Step 1 (Clarify Scope) and proceed directly to Step 2: Research and Outline in the Core Workflow below.
Follow this sequence for every blog post:
Blog Post Workflow:
1. Clarify scope and audience
2. Research and outline
3. Generate frontmatter
4. Write the draft
5. Add code examples, figures, and citations
6. Review and polish
Before writing, establish:
If the user provides a codebase, paper, or project as source material, explore it first to identify the most interesting angle for a blog post.
Build a structured outline before drafting:
Present the outline for user approval before writing the full draft. Adjust based on feedback.
For detailed structure patterns (deep dive, tutorial, explainer formats), consult references/writing-patterns.md.
Generate YAML frontmatter for the user's blog platform. The default Jekyll format:
---
title: "Deriving the Evidence Lower Bound"
subtitle: "I derive the evidence lower bound (ELBO) from scratch using Jensen's inequality."
layout: default
date: 2024-03-15
keywords: variational-inference, elbo, bayesian-inference, jensens-inequality
published: true
---
Key fields:
title — Clear, specific, SEO-friendly (50-60 characters ideal)subtitle — Starts with "I" + action verb (derive, explain, explore, prove, work through) + specific focus. Exactly one sentence with a period. Doubles as meta description.layout — default (single custom layout)date — YYYY-MM-DDkeywords — Comma-separated string (not an array), 4-6 keywordspublished — true to publish, false to hide from buildFor other platforms, consult references/seo-frontmatter.md.
Every post opens with context → purpose → roadmap. Include an explicit purpose statement: "The goal of this post is to..." Avoid generic openings like "In this post, we will explore..." or "X has become increasingly popular..." For specific patterns, consult references/writing-patterns.md.
For each section:
references/writing-patterns.md)Wrap the entire post body in {% katexmm %}...{% endkatexmm %} (see CRITICAL: Jekyll Post Generation Rules). This enables $...$ for inline math and $$...$$ for display math throughout the post. Do NOT use individual {% katex %} blocks.
$x$) for variables in prose, display math ($$...$$) for key equations\tag{N} for equations referenced later in the textInclude code when it reinforces understanding:
Structure code blocks as:
Brief explanation of what this code does:
\`\`\`python
# Clear, annotated code here
\`\`\`
Explanation of the output or key insight from running this.
Use the HTML figure convention for the default Jekyll blog. For other platforms, use standard Markdown images.
<div class='figure'>
<img src='/image/[topic-slug]/[filename].png'
style='width: 60%; min-width: 250px;' />
<div class='caption'>
<span class='caption-label'>Figure N.</span> Caption text that
fully describes what the figure shows.
</div>
</div>
Figure rules:
<div class='caption'> goes right after <img>, inside the same <div class='figure'>For detailed figure conventions and Mermaid patterns, consult references/diagrams.md.
For the default Jekyll blog using jekyll-scholar:
{% cite key %} — renders as (Author, Year)_bibliography/references.bib{% bibliography --cited %} in the post — the layout renders it automatically (see CRITICAL: Jekyll Post Generation Rules)author_year_firstword (e.g., vaswani_2017_attention)When to cite:
Verification requirement: Every citation must be verified programmatically. Never write BibTeX from memory.
Condensed verification workflow:
_bibliography/references.bibIf any step fails, use the placeholder pattern:
{% cite PLACEHOLDER_author2024_verify %}
<!-- TODO: Could not verify — author must confirm before publishing -->
For the complete workflow with Python code and API details, see references/citation-workflow.md. For Jekyll setup, see references/jekyll-setup.md.
Before delivering the final draft, verify:
{% katexmm %}...{% endkatexmm %}{% bibliography --cited %}/image/{post-slug}/ absolute paths_posts/, _bibliography/, image/ touchedFor a detailed scoring rubric (10 criteria, 1-5 scale), consult references/style-rubric.md.
| Type | Focus | Length | Code | Diagrams |
|---|---|---|---|---|
| Deep dive | Thorough exploration of one concept | 2000-4000 words | Supporting | Architecture, flow |
| Explainer | Make complex topic accessible | 1200-2500 words | Illustrative | Concept maps |
| Tutorial | Step-by-step building | 1500-3000 words | Central | Setup, flow |
| Project showcase | Walk through a build | 1500-2500 words | Central | Architecture |
For detailed patterns per post type, see references/writing-patterns.md.
When writing about ML, statistics, finance, or math:
{% cite key %} for jekyll-scholar, or link to papers and textbooksThis skill synthesizes writing philosophy from researchers and writers who excel at clear technical exposition:
| Source | Key Contribution to This Skill |
|---|---|
| Gregory Gundersen | Primary exemplar. Subtitle format, "naming things" technique, purpose statements, explicit closure, intuition-first derivations, cross-referencing |
| Gopen & Swan | 7 principles of reader expectations — topic/stress positions, old-before-new, subject-verb proximity |
| Andrej Karpathy | Single contribution focus, clear framing, connecting theory to practice |
| Zachary Lipton | Word choice, eliminating hedging, cutting intensifiers |
The baseline conventions above apply to all Gundersen-style posts. For more precise style matching, select one of four sub-styles based on the reader's goal:
| Sub-Style | Reader Goal | Typical Topics |
|---|---|---|
| Cataloging Explainer | Understand a general pattern and see instances | Distribution families, model classes, property sheets |
| Interpretive Reframer | See a familiar concept from a new angle | Loss function motivations, dual characterizations |
| First-Principles Narrative | Understand why something works | Algorithm design choices, "why" questions |
| Comprehensive Treatment | Get a complete multi-perspective reference | Foundational models (OLS, PCA), canonical decompositions |
For detailed system instructions, structural templates, few-shot excerpts, and anti-patterns for each sub-style, see references/gundersen-style-cards.md.
For exemplar posts demonstrating each convention, see references/sources.md. For detailed writing patterns, see references/writing-patterns.md. For the scoring rubric, see references/style-rubric.md.
Understanding reader behavior helps prioritize effort:
| Content Element | % Readers Who See It | Implication |
|---|---|---|
| Title | 100% | Must be specific and compelling |
| Opening paragraph | 80-90% | Front-load purpose and hook |
| Table of contents | 70-80% (if present) | Readers scan for sections they care about |
| Figures and diagrams | 60-70% | Examined before surrounding text |
| Code examples | 50-60% (technical readers) | Readers copy-paste and test |
| Math/derivations | 30-50% | Only engaged readers follow derivations |
| Conclusion | 40-60% | Many skip to the end after scanning |
Spend approximately equal time on each of:
If your title and opening don't hook the reader, your brilliant derivation in Section 3 will never be read.
Issue: Generic opening
Issue: No clear purpose
Issue: Too much math too early
Issue: Code examples don't run
Issue: Unverified citations
references/citation-workflow.md. Search → Verify → Retrieve → Validate → Add. Mark anything unverified as PLACEHOLDER.Issue: Post covers too much ground
Issue: No signposting
references/writing-patterns.md.Issue: Wrong subtitle format
Issue: Duplicate bibliography at page bottom
{% bibliography --cited %} from the post body. The default.html layout renders the bibliography automatically. See CRITICAL: Jekyll Post Generation Rules.Issue: Math not rendering (KaTeX)
$...$ or $$...$$ appears as plain text instead of rendered math{% katexmm %}...{% endkatexmm %} (after the YAML frontmatter, before any content). See CRITICAL: Jekyll Post Generation Rules.For detailed guidance beyond this core workflow:
references/writing-patterns.md — Gundersen writing style defaults. Blog structure templates for deep dives, explainers, and tutorials. Opening paragraph formula, transition techniques, signposting patterns, conclusion formulas.references/seo-frontmatter.md — Jekyll frontmatter (default) and other platforms (Hugo, Astro, Next.js). SEO title formulas, meta description templates, tag strategies.references/diagrams.md — HTML figure convention (Jekyll default). Mermaid diagram syntax for common patterns. When to use diagrams vs. prose. Figure design rules and caption conventions.references/jekyll-setup.md — Jekyll configuration reference. Plugins (jekyll-katex, jekyll-scholar), CSS design conventions, file organization, design philosophy.references/style-rubric.md — Draft evaluation rubric with 10-criteria scoring. Quick reference templates for openings, transitions, conclusions, and subtitles.references/citation-workflow.md — Citation verification workflow for blogs. API-based 5-step verification, Python implementation, BibTeX entry formats, hallucination prevention rules, jekyll-scholar troubleshooting.references/gundersen-style-cards.md — Four sub-style reference cards (Cataloging Explainer, Interpretive Reframer, First-Principles Narrative, Comprehensive Treatment). Selection heuristics, structural templates, few-shot examples, and anti-patterns for fine-grained Gundersen style guidance.references/sources.md — Source bibliography with Gundersen exemplar posts. Writing advice sources, tools and APIs, Jekyll ecosystem references.Expert guidance for Next.js Cache Components and Partial Prerendering (PPR). **PROACTIVE ACTIVATION**: Use this skill automatically when working in Next.js projects that have `cacheComponents: true` in their next.config.ts/next.config.js. When this config is detected, proactively apply Cache Components patterns and best practices to all React Server Component implementations. **DETECTION**: At the start of a session in a Next.js project, check for `cacheComponents: true` in next.config. If enabled, this skill's patterns should guide all component authoring, data fetching, and caching decisions. **USE CASES**: Implementing 'use cache' directive, configuring cache lifetimes with cacheLife(), tagging cached data with cacheTag(), invalidating caches with updateTag()/revalidateTag(), optimizing static vs dynamic content boundaries, debugging cache issues, and reviewing Cache Component implementations.
Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel. Use it when brand colors or style guidelines, visual formatting, or company design standards apply.
Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.