How to Add a Social Media Feed to Your Ghost Website
Someone on the Ghost forum put it perfectly: they'd just moved from Squarespace and were used to a built-in social feed widget. They searched "social media feed", "socials feed" — nothing. Ghost's docs explain how to add social icons, but that's not a live feed. The question keeps coming up because Ghost doesn't include this out of the box, and most tutorials stop at "edit your theme," leaving you stranded.
If you want a live social media feed on your Ghost site — showing your latest tweets, Instagram posts, or Bluesky updates — you have three realistic paths: embed scripts via code injection, use a third-party widget service, or edit your theme files directly. Each has tradeoffs. This guide covers all three clearly.
Quick answer: Ghost doesn't have a built-in social feed widget, but you can add one using Ghost's code injection (Settings → Advanced → Code Injection), a free embed widget from SociableKIT or EmbedSocial, or by inserting platform-specific embed scripts directly into your theme's template files.
Why doesn't Ghost have a built-in social feed?
Ghost's philosophy is minimal and fast. The core product handles publishing, memberships, and newsletters — not third-party social embeds. Social platform APIs change constantly (Twitter's became paid, Instagram's went through several deprecation cycles), so Ghost keeps those integrations out of the core to avoid breakage.
That said, Ghost gives you two escape hatches: code injection and theme file editing. Both let you drop in arbitrary HTML and JavaScript. The difference is scope — code injection runs site-wide or on a single page/post, while theme edits let you target specific template sections like the sidebar or footer.
Ghost also has an official Instagram integration for embedding individual posts in articles, but that's post-level, not a sitewide feed widget.
How do I add a social media feed using Ghost's code injection?
Code injection is the fastest path if you don't want to touch theme files. Go to Ghost Admin → Settings → Advanced → Code Injection. Code in the "Site Header" goes inside <head>; code in "Site Footer" goes before </body>.
For a Bluesky feed, the open-source bsky-embed web component works well. Add this to Site Footer:
<!-- Bluesky Feed Embed -->
<script type="module" src="https://unpkg.com/bsky-embed/dist/bsky-embed.es.js"></script>
<!-- Place this HTML wherever you want the feed -->
<bsky-embed
username="yourhandle.bsky.social"
mode="light"
limit="6"
></bsky-embed>For a Twitter/X feed, use Twitter's own embed script. Get your widget ID from publish.twitter.com, then add to Site Footer:
<a class="twitter-timeline"
href="https://twitter.com/YourHandle"
data-tweet-limit="5">Tweets by YourHandle</a>
<script async src="https://platform.twitter.com/widgets.js"></script>The downside: code injection adds the feed to every page. If you want it in a specific sidebar or page section, you'll need theme editing or a third-party widget with a placement div.
What's the easiest free tool for adding an Instagram or Facebook feed?
If you're not comfortable editing code, SociableKIT and EmbedSocial are the two most commonly recommended options on the Ghost forum. Both have free tiers.
| Tool | Networks | Free Tier | Ghost Setup |
|---|---|---|---|
| SociableKIT | Instagram, Facebook, Twitter/X, TikTok, YouTube | Yes (with branding) | Paste iframe/script via code injection |
| EmbedSocial | Instagram, Facebook, Google, TikTok | Yes (limited posts) | Copy embed code → code injection or HTML card |
| Common Ninja | RSS, Twitter, Instagram, YouTube | Yes (with branding) | Widget code → code injection |
| Twitter/X native | Twitter/X only | Yes | Script via code injection |
| bsky-embed | Bluesky only | Yes (open source) | Web component via code injection |
For Instagram specifically: as of 2026, Instagram's oEmbed API requires Facebook developer approval. SociableKIT and EmbedSocial handle the API auth for you, which is why they're popular for Instagram feeds. If you try to embed Instagram natively without their API, you'll hit authorization walls.
Worth noting: Ghost's integrations philosophy mirrors this — it leaves third-party connections to external services where API maintenance is their problem, not yours.
How do I add a social feed to a specific page, not the whole site?
Ghost lets you add code injection per-post and per-page too. Open any post or page in the editor, click the settings gear (⚙️) in the top right, scroll to "Post settings" → "Code injection". HTML/JS added here only runs on that specific post or page.
This is useful if you want a dedicated "Follow me" page with your full feed rather than cluttering your sidebar sitewide. Create a static page, use per-page code injection to add the feed widget, then link it from your navigation.
<!-- Example: YouTube channel feed via RSS widget on a specific page -->
<div id="yt-feed"></div>
<script>
fetch('https://api.rss2json.com/v1/api.json?rss_url=https://www.youtube.com/feeds/videos.xml?channel_id=YOUR_CHANNEL_ID')
.then(r => r.json())
.then(data => {
const container = document.getElementById('yt-feed');
data.items.slice(0,6).forEach(item => {
container.innerHTML += `<div style="margin:12px 0"><a href="${item.link}" target="_blank">${item.title}</a></div>`;
});
});
</script>This approach is also better for Core Web Vitals — social feed scripts add load time, so isolating them to one page keeps the rest of your site fast.
How do I add a social feed by editing my Ghost theme?
Theme editing gives you the most placement control. Ghost themes use Handlebars (.hbs) templates. Common targets are default.hbs (wraps all pages), index.hbs (home page), or a custom sidebar partial.
Here's the workflow:
- Download your theme via Ghost Admin → Settings → Design → Download current theme
- Unzip and locate the right template file (e.g.,
default.hbsfor sitewide,index.hbsfor home only) - Add your embed script/HTML in the appropriate section (sidebar, footer area, etc.)
- Zip and re-upload the theme
<!-- In default.hbs, inside your sidebar section -->
<div class="social-feed-widget">
<h4>Follow on Bluesky</h4>
<bsky-embed username="yourhandle.bsky.social" limit="4"></bsky-embed>
</div>
{{!-- Load the script before closing body --}}
<script type="module" src="https://unpkg.com/bsky-embed/dist/bsky-embed.es.js"></script>If you're on Ghost Pro, you have access to the theme editor in the dashboard. If you're self-hosted, SSH in and edit files directly or use the zip upload method. See the Ghost self-hosted setup guide for file access details.
Can I embed a YouTube feed on Ghost?
Yes. YouTube doesn't require API authentication for basic RSS-based feeds, which makes it the easiest social feed to add without a third-party service.
Your YouTube channel has an RSS feed at:https://www.youtube.com/feeds/videos.xml?channel_id=YOUR_CHANNEL_ID
You can convert this to JSON using the free rss2json API and render it with a small JavaScript snippet (shown in the code block above). No API key needed for basic use.
Alternatively, Common Ninja's free RSS widget handles YouTube feeds with a drag-and-drop UI and generates an embed code you paste into Ghost via code injection.
Why is my Instagram feed not loading on Ghost?
Instagram removed its public API access in 2019 and has restricted oEmbed since then. If you're seeing a broken feed, the most common causes are:
- API token expired — Instagram access tokens expire after 60 days unless refreshed
- Third-party service account disconnected — Re-authenticate your SociableKIT/EmbedSocial account with Instagram
- Old embed code — Instagram's old embed format stopped working; use current oEmbed or a widget service
- Business vs. personal account — Only Instagram Business accounts connected to a Facebook Page can use the Graph API for feeds
This is the same root cause behind Ghost Instagram embed errors — the issue is Instagram's API restrictions, not Ghost itself.
Does embedding a social feed hurt Ghost SEO or page speed?
It can. Social feed scripts (especially Twitter's widgets.js and Instagram's embed.js) are third-party resources that block rendering. The impact shows up in your PageSpeed Insights score as "eliminate render-blocking resources" or "reduce JavaScript execution time."
Mitigations:
- Load feed scripts with
asyncordefer - Use lazy loading (load the feed only when user scrolls to it)
- Isolate feeds to specific pages using per-page code injection instead of sitewide
- Use RSS-based feeds (like the YouTube example) which don't require third-party JS at all
For a deeper look at Ghost speed optimization, the Cloudflare caching guide for Ghost covers how to cache aggressively and still serve fresh social content.
Related Ghost Guides
- Ghost Instagram Embed Not Working — diagnose broken Instagram embeds specifically
- Improve PageSpeed Insights on Ghost — keep your score high even with embed scripts
- Cache Ghost with Cloudflare — offset the load impact of social widgets
- Ghost Nofollow Links Guide — handle outbound links to social platforms correctly
- Ghost Mailgun Alternatives — other integrations Ghost hands off to third parties
- Ghost Installation on Ubuntu — self-hosted setup for theme file access
Frequently Asked Questions
Does Ghost have a built-in social media widget?
No. Ghost doesn't include a native social feed widget. You add one via code injection, a third-party embed tool like SociableKIT, or by editing your theme template files directly.
How do I add my Twitter/X feed to Ghost?
Use Twitter's official timeline embed. Go to publish.twitter.com, select "Embedded Timeline," enter your profile URL, copy the generated code, and paste it into Ghost Admin → Settings → Advanced → Code Injection (Site Footer).
What is Ghost code injection and how do I use it?
Code injection lets you add HTML, CSS, or JavaScript to your Ghost site without editing theme files. Find it at Ghost Admin → Settings → Advanced → Code Injection. The "Site Header" section outputs inside <head>; "Site Footer" goes before </body>. Individual posts also have their own code injection via the post settings panel.
Can I add a Bluesky feed to my Ghost website?
Yes. The open-source bsky-embed web component works without an API key. Add the module script to Ghost's Site Footer code injection and place the <bsky-embed> element wherever you want the feed to appear.
Why is my Instagram feed not showing on Ghost?
Instagram's API requires authentication and tokens expire after 60 days. If using a widget service, re-authenticate your Instagram account in the service's dashboard. If using a custom embed, refresh your access token or switch to a managed service like EmbedSocial or SociableKIT.
Will adding a social feed slow down my Ghost site?
Third-party social scripts add render-blocking JavaScript. Load them with async/defer attributes, restrict them to specific pages using per-page code injection, or use RSS-based feeds (for YouTube) which have less performance overhead than social SDK scripts.
Can I add a social feed to just one page in Ghost?
Yes. Open the post or page in Ghost editor, click the settings gear (⚙️), scroll to "Code injection," and add your embed code there. It only runs on that specific page, not sitewide.
What's the best free tool for adding a social media feed to Ghost?
For Instagram and Facebook: SociableKIT or EmbedSocial (both have free tiers with branding). For Bluesky: bsky-embed (fully free, open source). For Twitter/X: Twitter's native embed (free). For YouTube: an RSS-to-JSON approach requires no third-party service at all.
The cleanest solution depends on your platform and technical comfort. If you're on a managed theme and want zero code, use SociableKIT or EmbedSocial — they generate a snippet you paste into code injection and their team handles API changes. If you're self-hosted and comfortable with a few lines of JavaScript, the bsky-embed component for Bluesky or the RSS approach for YouTube keeps everything in your control without third-party dependency.