Crimson reads a few global JavaScript variables (Content API key + behavior flags) before the theme scripts run, so this snippet must go into Ghost → Code Injection → Site Header (the <head> area).
Step 1 — Open Code Injection in Ghost Admin
Log in to your Ghost Admin.
Go to Settings → Advanced → Code Injection.
Code injection module in Ghost Admin Setting
Step 2 — Paste the snippet into “Site Header”
Find the Site Header box (not Site Footer). Paste your snippet exactly as-is into Site Header.
Replace the example values with your own (details below).
Click Save.
Ensure you are adding the script in Site header
Paste the script in Site header and click Save
Here’s a copy/paste-ready version with placeholders:
Why Site Header (not Footer)?
Ghost places Site Header code inside <head>, while Site Footer code is injected before </body>. For Crimson, the goal is to define window.GLOBALbefore the theme JS reads it.
Step 3 — Create a Custom Integration (to get the Content API key)
Ghost’s official docs recommend generating your Content API URL + key by creating a Custom Integration.
In Ghost Admin, go to Settings → Integrations.
Click Add custom integration.
Name it something like: CrimsonTheme.
Click Add.
After creation, a popup will appear. Copy these from the popup:
Content API Key → to be pasted into window.GHOST_CONTENT_API_KEY
API URL (Optional)(or Content API URL details shown there) → use only if you need window.GHOST_API_URL
Code injection in Site header of your Ghost website. Copy and Paste this script as is then update the variable values as per your preferances.
<script>
window.GHOST_CONTENT_API_KEY = '1234a5b6cde7fg8901h234i4j5';
// optional if your site uses a different canonical domain:
// window.GHOST_API_URL = 'https://your-site.tld';
</script>
<script>
// Override GLOBAL variables before theme loads them
window.GLOBAL = {
//1. Open external links in a new tab?
//accepted values: true, false
//default: true
OPEN_LINKS_IN_NEW_TAB: true,
//2. Enable image lightbox popup?
//accepted values: true, false
//default: true
ENABLE_IMAGE_LIGHTBOX: true,
//3. Auto hide the navigation header when scrolling down?
//accepted values: true, false
//default: true
AUTO_HIDE_HEADER: true,
//4. Default color scheme (light/dark/system)
//accepted values: 'dark', 'light', 'system'
//default: 'system'
DEFAULT_COLOR_SCHEME: 'system',
//5. Turn on if you want to automatically redirect a visitor to the website in visitor's browser language.
//accepted values: true, false
//default: false
REDIRECT_ON_LOCALE: false,
//6. Pagination style (load-more/paginated-pages) - Only applicable on paginated content for posts. Authors and Tags pages will always be 'load more' button.
//accepted values: 'load-more', 'paginated-pages'
//default: 'load-more'
PAGINATION_STYLE: 'load-more',
//7. Contact Endpoint for Contact form on Contact page
//If no endpoint is added, the contact form will be hidden
//default: '' - form will be hidden
CONTACT_ENDPOINT: 'https://example.com/api/contact',
//8. Contact Page YouTube link
//If no link is added, the YouTube will be hidden
YOUTUBE_LINK: '',
//9. Contact Page Instagram link
//If no link is added, the Instagram will be hidden
INSTAGRAM_LINK: '',
//10. Contact Page WhatsApp link
//If no link is added, the WhatsApp will be hidden
WHATSAPP_LINK: '',
//11. Contact Page TikTok link
//If no link is added, the TikTok will be hidden
TIKTOK_LINK: '',
//12. Contact Page Threads link
//If no link is added, the Threads will be hidden
THREADS_LINK: '',
//13. Contact Page LinkedIn link
//If no link is added, the LinkedIn will be hidden
LINKEDIN_LINK: '',
};
</script>
