Ghost is a popular CMS for bloggers and publishers, and it has a built-in code injection feature that makes adding a floating CTA button easy. Design your button with the generator, export the code, and paste it into Ghost's site footer injection — no theme editing needed.
Why Add a CTA Button to Ghost?
Ghost is built for publishers and content creators who monetize through subscriptions, newsletters, and memberships. A floating CTA button that says "Subscribe," "Join Free," or "Become a Member" stays visible as readers scroll through long-form articles, capturing signups at the moment of peak engagement rather than only at the end of a post.
Step-by-Step Instructions
Design your CTA button
Open the CTA Button Generator and customize your button using the visual editor. Pick colors, position, animation, hover effects, icon, and font. The live preview updates in real time so you see exactly what your visitors will get.
Export your code
When you are happy with the design, click "Get Code" to export a clean HTML + CSS snippet. The code is lightweight, has zero dependencies, and works on any website.
Open Ghost code injection
In your Ghost admin panel, go to Settings > Code injection. You'll see two fields: "Site Header" and "Site Footer".
Paste the code in the Site Footer field
Paste your CTA button code into the "Site Footer" field. This injects it before the closing </body> tag on every page of your Ghost site.
<!-- Paste your CTA button code in the Site Footer field -->Save and verify
Click Save, then visit your Ghost site. The floating CTA button should appear on all pages, including blog posts.
Best Practices for Ghost
Link the button to Ghost's built-in membership signup (#/portal/signup) to leverage Ghost's native subscription system.
Use the Site Footer injection field so the button loads after the page content for better perceived performance.
Choose a button color that contrasts with your Ghost theme's background to stand out without looking out of place.
If you use Ghost's built-in portal popup, position the CTA button away from the bottom-right corner where the portal icon appears.
Ready to build your button?
Design it visually, export clean code, and paste it into your site.
Open the GeneratorFrequently Asked Questions
Does Ghost support code injection on all plans?
Yes. Code injection is available on all Ghost plans, including the free self-hosted version and all Ghost(Pro) tiers.
Will the button appear on individual blog posts?
Yes. Code injected via the Site Footer appears on every page, including individual blog posts, the homepage, and tag/author pages.
Can I link the CTA button to Ghost's membership portal?
Yes. Set the button's link to #/portal/signup or #/portal to open Ghost's built-in membership signup modal directly from the floating button.
Will the button overlap with Ghost's default portal button?
It can if both are positioned in the bottom-right corner. Either move your CTA button to a different position or disable Ghost's default portal icon in the Portal settings.