Ghost Structured Data — JSON-LD, Article Schema, FAQ Schema and Open Graph

In this tutorial, you'll learn how Ghost handles structured data — the automatic JSON-LD markup for articles and pages, adding FAQ schema for rich results, configuring Open Graph for social sharing, and customizing schema for headless Ghost sites.

What You'll Learn

• What structured data is and why it matters for SEO
• Ghost's built-in JSON-LD Article schema
• How Ghost generates structured data automatically
• Adding custom schema markup via code injection
• FAQ schema for rich search results
• Open Graph tags for Facebook and LinkedIn
• Twitter Cards for Twitter sharing
• Validating structured data with Google's tools
• Structured data for headless Ghost sites

Why It Matters

Structured data helps search engines understand your content. It enables rich results in search — article snippets, FAQ expandable answers, breadcrumbs, and author information. These rich results improve click-through rates and visibility. Ghost generates essential structured data automatically, but adding custom schema (like FAQ or Recipe) gives you an edge over competitors who do not use it.

Real-World Use

A recipe site uses Ghost with custom Recipe schema injected via code injection. When someone searches for "vegan pasta recipe," the search result shows the recipe with a photo, star rating, cooking time, and calorie count directly in the search snippet. The rich result has a 30% higher click-through rate than the plain text result below it.

Learning Path

flowchart LR
  A["Google Analytics"] --> B["Structured Data
You are here"]:::current
  B --> C["Performance Optimization"]
  C --> D["Advanced Configuration"]

  classDef current fill:#38bdf8,color:#0f172a,stroke-width:2px

What is Structured Data?

Structured data is a standardized format for providing information about a page and classifying its content. It uses schema.org vocabulary in JSON-LD format.

Ghost uses JSON-LD (JavaScript Object Notation for Linked Data) — a format that is easy for both humans and machines to read.

Ghost's Built-in JSON-LD

Ghost automatically generates JSON-LD structured data for every page. This happens in the background — you do not need to configure anything for basic structured data.

Article Schema

For every post, Ghost generates:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Your Post Title",
  "description": "Post excerpt or meta description",
  "image": {
    "@type": "ImageObject",
    "url": "https://yoursite.com/content/images/image.jpg",
    "width": 1200,
    "height": 800
  },
  "datePublished": "2024-01-15T10:00:00.000Z",
  "dateModified": "2024-01-20T14:30:00.000Z",
  "author": {
    "@type": "Person",
    "name": "Author Name",
    "url": "https://yoursite.com/author/author-slug/"
  },
  "publisher": {
    "@type": "Organization",
    "name": "Your Site Name",
    "logo": {
      "@type": "ImageObject",
      "url": "https://yoursite.com/logo.png"
    }
  },
  "mainEntityOfPage": {
    "@type": "WebPage",
    "@id": "https://yoursite.com/post-slug/"
  }
}
</script>

WebPage Schema

For pages and the homepage, Ghost generates WebPage schema:

{
  "@context": "https://schema.org",
  "@type": "WebPage",
  "name": "Page Title",
  "description": "Page description"
}

Adding Custom FAQ Schema

You can add FAQ schema to individual posts for rich results with expandable FAQs.

Method 1: Using Ghost's FAQ Shortcode

Ghost provides a {{< faq >}} shortcode that generates both visible HTML and JSON-LD:

<details style="margin-bottom:12px;border:1px solid #e2e8f0;border-radius:10px;overflow:hidden"><summary style="cursor:pointer;padding:14px 18px;font-weight:600;font-size:1.05rem;background:#f8fafc;border-bottom:1px solid #e2e8f0;color:#1e293b">What is Ghost CMS?</summary><div style="padding:14px 18px;color:#475569;line-height:1.7;background:#fff"><p>Ghost is an open-source publishing platform built on Node.js.</p>
</div></details>

This generates:

1. Visible HTML: The question and answer displayed on the page
2. JSON-LD: FAQ schema injected into the page's structured data

Method 2: Manual FAQ Schema via Code Injection

For more control, add FAQ schema in the Post Header code injection:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [{
    "@type": "Question",
    "name": "What is Ghost?",
    "acceptedAnswer": {
      "@type": "Answer",
      "text": "Ghost is an open-source publishing platform built on Node.js."
    }
  }, {
    "@type": "Question",
    "name": "Is Ghost free?",
    "acceptedAnswer": {
      "@type": "Answer",
      "text": "Yes, Ghost is open-source and free to self-host."
    }
  }]
}
</script>

Adding Custom Schema Types

Recipe Schema

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Recipe",
  "name": "Vegan Pasta",
  "prepTime": "PT15M",
  "cookTime": "PT10M",
  "totalTime": "PT25M",
  "recipeYield": "4 servings",
  "recipeIngredient": [
    "200g pasta",
    "2 tomatoes",
    "1 onion"
  ],
  "recipeInstructions": [
    { "@type": "HowToStep", "text": "Boil water." },
    { "@type": "HowToStep", "text": "Cook pasta." }
  ]
}
</script>

Product Schema

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Digital Guide",
  "description": "A comprehensive digital guide",
  "offers": {
    "@type": "Offer",
    "price": "29.00",
    "priceCurrency": "USD",
    "availability": "https://schema.org/InStock"
  }
}
</script>

Breadcrumb Schema

Ghost does not generate breadcrumb schema automatically. Add it via code injection:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [{
    "@type": "ListItem",
    "position": 1,
    "name": "Home",
    "item": "https://yoursite.com/"
  }, {
    "@type": "ListItem",
    "position": 2,
    "name": "Tutorials",
    "item": "https://yoursite.com/tutorials/"
  }, {
    "@type": "ListItem",
    "position": 3,
    "name": "Current Post"
  }]
}
</script>

Open Graph Tags

Open Graph tags control how your content appears when shared on Facebook, LinkedIn, and other platforms.

Ghost's Automatic OG Tags

Ghost generates these automatically:

<meta property="og:title" content="Post Title" />
<meta property="og:description" content="Post description" />
<meta property="og:image" content="https://yoursite.com/image.jpg" />
<meta property="og:url" content="https://yoursite.com/post-slug/" />
<meta property="og:type" content="article" />
<meta property="og:site_name" content="Site Name" />

Custom OG Settings Per Post

In the post SEO settings, you can override:

• Facebook Title
• Facebook Description
• Facebook Image
• Twitter Title
• Twitter Description
• Twitter Image

Use these when the default values (derived from title, excerpt, feature image) are not optimal for social sharing.

Twitter Cards

Ghost automatically generates Twitter Card tags:

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Post Title" />
<meta name="twitter:description" content="Post description" />
<meta name="twitter:image" content="https://yoursite.com/image.jpg" />
<meta name="twitter:url" content="https://yoursite.com/post-slug/" />

If you set a Twitter profile in Ghost settings, it also adds:

<meta name="twitter:site" content="@yourhandle" />
<meta name="twitter:creator" content="@yourhandle" />

Validating Structured Data

Google Rich Results Test

Go to search.google.com/test/rich-results and enter your URL. Google shows:

• Valid structured data detected
• Errors and warnings
• Preview of rich results

Facebook Sharing Debugger

Go to developers.facebook.com/tools/debug/ and enter your URL. This shows:

• Open Graph tags detected
• Image preview
• Errors and warnings

Twitter Card Validator

Use the Twitter Card validator at cards-dev.twitter.com/validator.

Structured Data for Headless Ghost

In headless mode, Ghost does not inject structured data or Open Graph tags. You must generate them in your frontend.

function StructuredData({ post }) {
  const schema = {
    "@context": "https://schema.org",
    "@type": "Article",
    "headline": post.title,
    "description": post.excerpt,
    "image": post.feature_image,
    "datePublished": post.published_at,
    "dateModified": post.updated_at,
    "author": {
      "@type": "Person",
      "name": post.primary_author.name
    }
  };

  return (
    <script
      type="application/ld+json"
      dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}
    />
  );
}

Common Mistakes

1. Using the wrong schema type: Article schema for a recipe page will not generate recipe-rich results. Use the most specific schema type that matches your content. Recipe for recipes, Product for products, FAQ for questions.

2. Duplicate structured data: Adding FAQ schema via code injection when Ghost already generates it via the {{< faq >}} shortcode creates duplicate entries. Use one method, not both.

3. Invalid JSON-LD: A missing comma or bracket in JSON-LD invalidates the entire schema block. Validate your markup with Google's Rich Results Test.

4. Not setting custom Open Graph images: The feature image is used by default, but social platforms prefer specific aspect ratios (1.91:1 for Facebook, 2:1 for Twitter). Custom social images ensure proper display.

5. Overlooking the publisher logo: Ghost includes the publisher logo in schema data. If your logo is not set in Ghost settings, the publisher object will be incomplete. Always upload a publication logo.

Practice Questions

1. What structured data does Ghost generate automatically? Answer: Ghost automatically generates JSON-LD Article schema for posts and WebPage schema for pages. This includes headline, description, image, dates, author, publisher, and mainEntityOfPage. Ghost also generates Open Graph and Twitter Card tags.

2. How do you add FAQ schema to a Ghost post? Answer: Use the `

   Question

   Answer

   ` shortcode in your content. Ghost generates the visible FAQ section and injects the corresponding FAQPage JSON-LD schema. Alternatively, add custom FAQ schema manually via code injection.

3. What tools can you use to validate structured data? Answer: Google Rich Results Test (search.google.com/test/rich-results) for schema validation, Facebook Sharing Debugger (developers.facebook.com/tools/debug/) for Open Graph, and Twitter Card Validator (cards-dev.twitter.com/validator) for Twitter Cards.

4. Challenge: Create a post in Ghost that uses at least two types of schema. Add FAQ schema using the {{< faq >}} shortcode. Add a custom Recipe schema via code injection. Validate both schemas using Google Rich Results Test. Then test Open Graph previews using the Facebook Sharing Debugger.

FAQ

Mini Project

Your task: Implement comprehensive structured data for a Ghost site.

1. Audit the current structured data on your Ghost site using Google Rich Results Test.
2. Identify which schema types would benefit your content (FAQ, Recipe, Product, Course, etc.).
3. Implement any additional schema using code injection.
4. Add custom Open Graph images for the 5 most important posts.
5. Validate every page type: homepage, post, page, tag, and author.
6. Create a structured data checklist for future content creation.

This exercise ensures your site is fully optimized for rich search results.

What's Next

Now that structured data is configured, optimize your site's performance:

Continue to Lesson 34: Performance Optimization — Caching, image optimization, and CDN configuration.

Related lessons:

• Advanced Configuration — Custom routes and redirects
• Production Deployment — Deploy Ghost for scale