Typography

Heading 1 — The Main Title

Heading 2 — Section Header

Heading 3 — Subsection

Heading 4 — Minor Section

Heading 5 — Detail Level

Heading 6 — Fine Print Level

Paragraphs and Inline Formatting

This is a standard paragraph with bold text, italic text, and bold italic combined. You can also use inline code for technical terms, underlined text for emphasis, and ~~strikethrough~~ for corrections.

Ghost's editor produces clean, semantic HTML. Every paragraph is wrapped in <p> tags. Line breaks within paragraphs create <br> tags. The typography is designed for long-form reading with comfortable line heights and optimal measure (characters per line).

Here's a paragraph with a link to Ghost's website. Links are styled with the accent color and include hover states for better interactivity.

Ordered Lists

1. First item in the ordered list
2. Second item with bold and italic formatting
3. Third item with a link inside
4. Fourth item — lists support any inline formatting
   1. Nested ordered list item
   2. Another nested item
5. Fifth item after the nested list

Unordered Lists

• Bullet point with standard text
• Another point with code formatting
• Point with strong emphasis
• Nested bullets:
  • Sub-item one
  • Sub-item two with a link
  • Sub-item three
• Final bullet point

Blockquotes

The best way to predict the future is to create it. Ghost gives you the tools to build the publication you've always wanted.

A longer quote that spans multiple lines. This demonstrates how blockquotes handle paragraph-length content with proper styling, indentation, and visual hierarchy.

— Abraham Lincoln (probably)

Tables

Images

The image above uses the wide layout. Ghost supports three image widths: normal, wide, and full-bleed.

Gallery

Code Blocks

JavaScript

// Ghost Admin API — Create a post
const GhostAdminAPI = require('@tryghost/admin-api');

const api = new GhostAdminAPI({
    url: 'https://your-site.com',
    key: 'your-admin-api-key',
    version: 'v5.0'
});

async function createPost() {
    const post = await api.posts.add({
        title: 'My First API Post',
        html: '<p>Hello from the API!</p>',
        status: 'draft',
        tags: ['api', 'tutorial']
    });
    console.log(`Created: ${post.url}`);
}

createPost();

Python

import jwt
import requests
from datetime import datetime

# Generate Ghost Admin API token
key_id, key_secret = admin_key.split(':')
iat = int(datetime.now().timestamp())

header = {'alg': 'HS256', 'typ': 'JWT', 'kid': key_id}
payload = {'iat': iat, 'exp': iat + 300, 'aud': '/admin/'}

token = jwt.encode(
    payload,
    bytes.fromhex(key_secret),
    algorithm='HS256',
    headers=header
)

# Fetch posts
response = requests.get(
    f'{ghost_url}/ghost/api/admin/posts/',
    headers={'Authorization': f'Ghost {token}'}
)
print(f"Found {len(response.json()['posts'])} posts")

CSS

/* Academy theme — course card */
.course-card {
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    overflow: hidden;
    transition: transform var(--transition-fast),
                box-shadow var(--transition-fast);
}

.course-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

Callout Cards

Toggle / Accordion

Bookmark Card

Ghost: The Creator Economy Platform

The world's most popular modern publishing platform for creating a new media platform. Used by Apple, Sky News, OpenAI, and thousands more.

Ghost Foundationghost.org

Horizontal Rule

Content above the divider.

Content below the divider. Horizontal rules create visual separation between sections.

Embed

Ghost supports embeds from YouTube, Twitter/X, Vimeo, CodePen, Spotify, and many other platforms. Simply paste a URL on its own line in the editor.

Button Card

Summary

This page demonstrates every content element available in Ghost's editor. When building courses with Academy, you have access to all of these tools to create rich, engaging lessons that keep students learning.

Each element is styled to match the Academy theme's warm, inviting design system — ensuring consistency across your entire course platform.