FeaturesHow it worksPricingBlog
All articles
Tutorial2025-05-15 · 9 min read

How to Embed YouTube Videos on Ghost with EmbedShorts

Ghost is the modern platform for independent publishers, newsletters, and content creators who want full control over their content and monetization. If you're running a Ghost publication and want to embed dynamic YouTube video content, EmbedShorts is the simplest, cleanest solution.

Add stunning video feeds to your Ghost posts and pages in minutes—no complicated setup, no learning curves, just pure content magic.

Why Embed Videos on Ghost?

  • Increase engagement: Video keeps readers on your pages longer
  • Boost monetization: More time-on-page = more valuable ad impressions
  • Improve SEO: Fresh content and user engagement signal quality to Google
  • Build audience: Video content is 80x more likely to be shared
  • Maintain independence: No reliance on third-party platforms
  • Auto-update content: Videos pull automatically from YouTube
  • Professional look: Modern video feeds elevate your publication

What You'll Need

  1. A Ghost account (any plan with API access)
  2. Admin access to your Ghost blog
  3. A YouTube channel or playlist with videos to share
  4. An EmbedShorts account (free to start)

Step 1: Create Your EmbedShorts Widget

  1. Go to embedshorts.com and sign up
  2. Click "Create New Widget"
  3. Select content type:
    • Shorts: Perfect for TikTok/Reels-style vertical videos
    • Videos: Better for longer-form content and tutorials
  4. Choose a template:
    • Minimal: Clean, perfect for blog posts
    • Magazine: Publication-style layout
    • Publisher: Optimized for news and media
    • News: Breaking story format
    • Featured: Showcase main video + sidebar
  5. Configure:
    • Source: YouTube Channel or Playlist
    • Paste your YouTube channel URL or playlist ID
    • Set max videos (5-10 recommended for posts)
    • Choose orientation (portrait or landscape)
  6. Customize colors:
    • Match your Ghost theme colors
    • Set accent color and background color
    • Adjust spacing and border radius
  7. Publish

Step 2: Get Your Embed Code

  1. In EmbedShorts dashboard, click "Share"
  2. Select "Embed Code"
  3. Copy the code: 
    <script src="https://embed.embedshorts.com/widget.js" data-widget-id="YOUR_WIDGET_ID"></script>
<div id="embedshorts-YOUR_WIDGET_ID"></div>

Step 3: Add to Your Ghost Posts/Pages

Method 1: Using HTML Card (Recommended)

Ghost's HTML card is perfect for embeds:

  1. Create or edit a Ghost post
  2. In the editor, type "/" to open the block menu
  3. Search for "HTML" or "Code"
  4. Click the "HTML" card
  5. Paste your EmbedShorts code into the HTML block
  6. The preview should show your video feed
  7. Click outside the block to save
  8. Publish your post

Method 2: Using HTML in Markdown (Alternative)

If you prefer Markdown:

  1. Add a Markdown card to your post
  2. Paste your EmbedShorts code directly in the Markdown
  3. Ghost renders the HTML when published

Method 3: Adding to Your Ghost Theme (Site-Wide)

To display videos on every post or page:

  1. Go to Ghost Admin → Settings → Code Injection
  2. Find the "Site Header" or "Post Footer" section
  3. Paste your EmbedShorts code there
  4. Videos appear on all posts automatically

⚠️ Note: This shows the same feed everywhere. For post-specific videos, use Method 1 instead.

Method 4: Using a Custom Ghost Theme Helper (Advanced)

If you have custom theme development:

  1. Edit your Ghost theme (in your hosting control panel)
  2. Add to your post.hbs template:
{{#if feature_image}}
  <figure class="post-image">
    <img src="{{feature_image}}" alt="{{title}}">
  </figure>
{{/if}}

<!-- Add EmbedShorts after featured image -->
<div class="post-embedshorts">
  <script src="https://embed.embedshorts.com/widget.js" data-widget-id="YOUR_WIDGET_ID"></script>
  <div id="embedshorts-YOUR_WIDGET_ID"></div>
</div>
  1. Add some CSS to style it:
.post-embedshorts {
  margin: 40px 0;
  padding: 20px;
  border-radius: 8px;
}
  1. Publish your updated theme

Best Places to Embed Videos in Ghost

Blog Posts

Add videos relevant to your article:

How-To Posts:

  • Embed tutorial or instructional videos
  • Enhance written instructions with video
  • Position after key sections or at the end

Roundup/List Posts:

  • "Top 10 [Topic] Videos"
  • Embed the actual videos you're discussing
  • Drive engagement from start to finish

News/Commentary Posts:

  • Embed related news videos
  • Provide context and multiple perspectives
  • Position below your commentary

Interview/Profile Posts:

  • Embed interview video footage
  • Pair with written transcript or summary
  • Great for newsletters

Homepage

Create a featured section:

  1. Create a "Featured Videos" collection on your homepage
  2. Use the "Featured" or "Slider" layout
  3. Limit to 3-5 videos for visual impact
  4. Add a headline: "Latest from our channel"

Author Archive Pages

Showcase creator work:

  • Link to author's YouTube channel
  • Embed recent videos by that author
  • Build author credibility

Topic/Tag Pages

Curate by subject:

  • Create separate embeds for different topics
  • Organize videos by theme
  • Help readers find related content

Sidebar/Footer (Theme Level)

If your Ghost theme supports it:

  • Add "Recent Videos" section
  • Latest content from your channel
  • Keep readers engaged with fresh content

Ghost-Specific Tips

Responsive Design

Ghost is fully responsive:

  1. EmbedShorts automatically adapts to screen size
  2. On desktop: Full width within article
  3. On tablet: Scales proportionally
  4. On mobile: Single column, optimized for touch
  5. Test on actual device to ensure quality

Matching Your Ghost Theme

Ghost themes are highly customizable:

  1. Get your theme's primary color:
    • Go to Settings → Brand
    • Note your accent color
  2. In EmbedShorts dashboard:
    • Set accent color to match
    • Set background to match your article background
  3. Republish widget
  4. Your embed feels native to Ghost

Custom CSS for Ghost

If you want fine-tuned styling:

  1. Go to Settings → Code Injection
  2. In Site Header, add custom CSS:
<style>
div[id*="embedshorts"] {
  margin: 40px 0;
  padding: 20px;
  background: #f5f5f5;
  border-radius: 8px;
}

@media (max-width: 640px) {
  div[id*="embedshorts"] {
    margin: 20px 0;
    padding: 15px;
  }
}
</style>
  1. All posts inherit this styling

Ghost Membership Integration

If you use Ghost memberships:

  1. Add videos to member-only posts
  2. Video content adds value to your membership
  3. Increases conversion rate (more reasons to join)
  4. Pair with email newsletter snippets

Ghost Newsletter Integration

Ghost has email newsletters built-in:

  1. When you email a post, the HTML embed code goes to email too
  2. Most email clients support embedded video
  3. Consider adding: "Watch the full video on the website"
  4. Link to your site for full experience

⚠️ Note: Some email clients strip video. Link to your site for fallback.

Monetization Strategies with Video

Ghost is built for creators—here's how video helps:

Ad-Supported:

  • More time-on-page = more ad impressions
  • Video engagement increases revenue
  • YouTube videos paired with Google AdSense

Membership:

  • Embed exclusive video content
  • Members see videos first
  • Drive subscriptions

Email Sponsorships:

  • Create engaging content
  • Sponsor posts that include videos
  • Higher engagement = higher sponsor rates

Newsletter Premium Tiers:

  • Free subscribers: Text previews
  • Paid subscribers: Full video embeds
  • Create tiered content experience

Troubleshooting on Ghost

Videos aren't showing in HTML card?

  • Make sure you pasted the complete code
  • Check that your YouTube channel is public
  • Try reloading the page
  • Refresh your browser cache

Embed looks broken in editor?

  • This is normal! Ghost editor doesn't always render embeds perfectly
  • Publish and check the live post
  • If it looks good live, you're fine
  • The editor preview is just approximate

YouTube channel isn't loading?

  • Verify your channel is public (not private/unlisted)
  • Check the channel URL is correct in EmbedShorts dashboard
  • Try a different browser or incognito window
  • Contact EmbedShorts support if it persists

Embed doesn't look right on mobile?

  • Test on actual mobile device (not browser resize)
  • EmbedShorts is fully responsive
  • May be a Ghost theme responsive issue
  • Check your Ghost theme's mobile styling

Slowing down my publication?

  • EmbedShorts widget is <15 KB
  • Uses CDN delivery (fast globally)
  • Won't impact your page speed
  • Your Ghost speed should remain excellent

Can I use it in my email newsletter?

  • Yes! Paste the code in HTML email cards
  • Note: Some email clients strip video
  • Add fallback link: "Watch on our website"
  • Test in major email providers

SEO Benefits on Ghost

Video content boosts Ghost SEO:

  • Fresh content: Signals active publication to Google
  • Time-on-page: Visitors read longer (ranking factor)
  • Engagement: Video shares = backlinks
  • User experience: Signals quality site to Google
  • Multimedia content: Indexed by Google and rich snippets

Performance

EmbedShorts is built for publisher platforms:

  • Ultra-lightweight: <15 KB (no performance hit)
  • CDN delivery: Global fast loading
  • Lazy loading: Videos load only when visible
  • No external dependencies: Clean codebase
  • Ghost-friendly: Works on all Ghost plans

Advanced: Ghost API Integration (Developers)

If you're building custom Ghost integrations:

// Fetch EmbedShorts data
const response = await fetch('https://api.embedshorts.com/embed/YOUR_WIDGET_ID');
const { videos, settings } = await response.json();

// Use in your custom Ghost theme or application

Contact support for full API documentation.

Ghost Plan Compatibility

| Plan | HTML Cards | Custom Code | Best For | |------|-----------|------------|----------| | Starter | ✓ | ✓ | Bloggers | | Creator | ✓ | ✓ | Creators | | Pro | ✓ | ✓ | Professionals | | Business | ✓ | ✓ | Publishers | | Self-Hosted | ✓ | ✓ | Full control |

All Ghost plans support HTML embeds.

Pricing & Getting Started

EmbedShorts is free to start:

  • 1 widget
  • 1,000 monthly views
  • Full customization
  • No credit card

Upgrade as you grow:

  • Starter: $19/mo (3 widgets, 10K views)
  • Pro: $99/mo (10 widgets, 100K views)
  • Agency: $499/mo (unlimited, white-label)

Ready to add video to your Ghost publication?

  1. Sign up for free
  2. Create your widget (2 minutes)
  3. Copy the embed code
  4. Paste into HTML card in your Ghost post
  5. Publish

FAQs

Works with all Ghost versions? Yes, all versions support HTML cards and code injection.

Can I embed multiple videos per post? Yes, add multiple HTML cards with different embeds.

Will it slow down Ghost? No. Widget is <15 KB and uses CDN.

Do my readers need to be logged in to see videos? No, embeds work for all readers (members and non-members).

Can I customize the video feed? Fully. Match your Ghost brand colors and style.

What if I want to monetize my videos? Embed your YouTube videos—you still earn YouTube revenue.

Is the embed responsive? Completely. Automatically adapts to all devices.

Do I need to code this? Not at all. Use the HTML card like any other content block.

Enhance your Ghost publication with video. Create your free EmbedShorts account and embed dynamic YouTube videos in your next post.

Ready to embed YouTube videos?

Free plan available. No credit card. 5-minute setup.

Start for free →