CTA Button GeneratorCTA Generator

Platform Guide

How to Add a CTA Button to Notion Sites

Add a floating call-to-action button to your published Notion site.

Notion Sites lets you publish Notion pages as websites. While Notion's editing experience is great, customization options are limited. A floating CTA button adds a persistent call-to-action to your published site using Notion Sites' custom code feature.

Why Add a CTA Button to Notion Sites?

Notion Sites are inherently minimal — great for content, but lacking in conversion-focused features. Most Notion-published sites are documentation, knowledge bases, or simple company pages where visitors need a clear next step. A floating CTA button adds that missing conversion layer, giving visitors a persistent way to "Contact Us," "Start a Trial," or "Join the Waitlist" without cluttering Notion's clean page layout.

Step-by-Step Instructions

01

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.

02

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.

03

Open your Notion site settings

Navigate to the page you've published as a Notion Site. Open the Site settings by clicking "Settings" in the site customization panel.

04

Add custom code

In the site settings, find the "Custom code" section. Paste your CTA button code into the custom code field. This injects the code into every page of your Notion site.

<!-- Paste your CTA button code in the Custom code field -->
05

Publish and verify

Save your settings and visit your published Notion site. The floating CTA button should appear on all pages.

Best Practices for Notion Sites

  • Use the custom code feature in Notion Sites settings rather than trying to embed code within Notion blocks for reliable site-wide coverage.

  • Keep the button design minimal to match Notion's clean aesthetic — a simple rounded button with a subtle shadow works well.

  • Link to an external form (Typeform, Google Forms, Cal.com) since Notion Sites don't support native forms.

  • Test the button on your custom domain if you use one — Notion Sites' rendering can differ slightly between notion.site and custom domains.

Ready to build your button?

Design it visually, export clean code, and paste it into your site.

Open the Generator

Frequently Asked Questions

Which Notion plan supports custom code?

Notion Sites with custom code injection requires a Notion Plus, Business, or Enterprise plan.

Will the button show in the Notion editor?

No. Custom code only renders on the published Notion site, not in the Notion editor.

Can I add the button to only certain pages of my Notion site?

No. Notion Sites' custom code injection applies to all published pages. You cannot target individual pages with different code.

Does the button work on Notion Sites with a custom domain?

Yes. The custom code injection works the same way regardless of whether you use a notion.site subdomain or a custom domain.