Common questions · 9 min read

Troubleshoot embedded checkout

Fix the most common website-builder, script, preview, and checkout-button issues when embedding Zwely on your site.

Most embed problems are not actually checkout problems. They usually come from the page builder changing the code, the script being placed in the wrong kind of block, a preview mode blocking JavaScript, or the button markup being separated from the Zwely script that powers it.

The good news: you do not need to understand every line of the embed code to fix this. Pick the symptom that matches what you see, or jump straight to the instructions for the website builder you are using.

If the checkout button appears and opens the modal, the embed is working. From there, any product, payment, delivery, or license issue usually lives in Zwely product setup rather than the website builder.

Start with the exact problem you are seeing. These shortcuts take you to the most likely fix so you do not have to read the whole guide first.

Button is missing Nothing shows up on the page after pasting the code. Clicking does nothing The button appears, but checkout never opens. Wrong product opens Checkout appears, but it is for another product. Mobile is broken Desktop works, but mobile is missing, clipped, or untappable. Payment or delivery is off Checkout opens, but setup feels incomplete after that. Find your website builder Shopify, WordPress, Webflow, Wix, Squarespace, Framer, and more.

Before you start

  • Open the product in Zwely and copy fresh embed code from the product embed step.
  • Open the page editor for the website page where the button should appear.
  • If possible, keep the published page open in another tab. Published pages are more reliable for testing than builder previews.
  • If another person manages your website, send them both snippets and this guide.

Quick 5-minute triage

  1. 01

    Confirm both snippets are present

    The first snippet loads Zwely on the page. The second snippet places the product-specific checkout button. If the script is missing, the button may appear but not open checkout. If the button snippet is missing, there is nothing visible for buyers to click.

  2. 02

    Paste into a custom HTML or embed block

    Use a block meant for raw HTML, custom code, or embeds. Do not paste the code into a normal text block, rich text editor, Markdown paragraph, or visual heading block unless that tool explicitly supports scripts.

  3. 03

    Publish, then test the public page

    Many builders sanitize scripts in editor preview mode. Save or publish the page, open the public URL, refresh once, and click the button there before assuming the embed is broken.

  4. 04

    Check the browser console only if needed

    If the button still does not work, open your browser developer console and look for blocked script, Content Security Policy, mixed content, or JavaScript errors. You do not need to debug deeply; the wording usually points to the category of problem.

  5. 05

    Try a clean test page

    Create a blank hidden page with only the Zwely embed code. If it works there, the issue is probably the original page template, theme, optimization plugin, custom JavaScript, or builder setting.

Website builders

Website-builder instructions

Use the card for the platform you are publishing on. If your exact builder is not listed, look for its Custom HTML, Embed, Code, Custom Liquid, or Footer Scripts area.

Shopify WordPress, Elementor, Divi, and similar builders Webflow Squarespace Wix Framer Carrd Ghost, Kajabi, Teachable, Thinkific, Podia
Ecommerce

Shopify

  1. Add the product button snippet to a Custom Liquid block, theme section, or the product/landing-page template where the checkout button should appear.
  2. Place the Zwely script snippet on the same template or in the theme layout/footer so it loads on that page.
  3. Save the theme, open the public or preview URL, refresh once, and test the button from the page buyers will actually visit.

Watch for: Theme optimizers and script-delay apps can stop checkout from opening. If the button appears but does nothing, exclude the Zwely script from those tools.

WordPress

WordPress, Elementor, Divi, and similar builders

  1. Use a Custom HTML block in WordPress, or an HTML/Code widget in Elementor, Divi, Beaver Builder, Oxygen, or Bricks.
  2. Paste the button snippet where the CTA should appear. Put the script snippet in the same block or in a footer/custom-code plugin area.
  3. Update the page, clear any cache, and test in a private browser window.

Watch for: Caching, minify, defer, and delay-JavaScript plugins are the most common WordPress embed blockers.

Website builder

Webflow

  1. Use an Embed element exactly where the checkout button should appear.
  2. Paste the button snippet there, then add the script snippet in page settings or site custom code if your Webflow plan supports it.
  3. Publish the site before testing. Webflow designer preview can behave differently from the live page.

Watch for: Custom code requires the right Webflow plan. If scripts are not supported, the button cannot open checkout from that page.

Website builder

Squarespace

  1. Use a Code Block, not a normal text block.
  2. Paste the button snippet where it belongs visually, and add the script through the same Code Block or the code injection area if your plan supports it.
  3. Publish the page and test the public URL instead of relying only on editor preview.

Watch for: Some Squarespace plans and templates limit script support. If scripts are stripped, check plan/code-injection access.

Website builder

Wix

  1. Use an Embed HTML element or Wix custom-code tools, not a regular text element.
  2. Place the button where buyers should click and make sure the embed container is wide enough for the button.
  3. Publish before testing, then check both desktop and mobile layouts in Wix.

Watch for: Containers can clip embedded content or sit above the button on mobile. If clicks do not register, check layering and mobile layout.

Website builder

Framer

  1. Use the Embed component for the button snippet.
  2. Put the script snippet in the page or project custom-code area where Framer allows scripts.
  3. Test from the published Framer URL, not only from the canvas preview.

Watch for: Canvas preview and published behavior can differ, especially when external scripts are involved.

Landing page

Carrd

  1. Use an Embed element and confirm your Carrd plan supports custom code.
  2. Paste the button snippet where the CTA should appear and the script snippet where scripts are allowed.
  3. Publish after saving, then test the live page.

Watch for: If your Carrd plan does not allow custom code, the checkout modal cannot run directly on that page.

Publishing and course platforms

Ghost, Kajabi, Teachable, Thinkific, Podia

  1. Use an HTML card, custom HTML section, or code block if the platform provides one.
  2. Keep checkout code on a marketing or sales page where custom scripts are allowed. Many hosted course checkout pages block third-party scripts.
  3. Publish a hidden test page first so you can confirm the platform allows the modal before using it in a launch.

Watch for: Some hosted platforms intentionally restrict scripts. If that happens, host the Zwely button on a separate landing page that supports custom code.

Common causes and how to fix them

The button does not appear at all

This usually means the button snippet was pasted somewhere the builder does not render raw HTML, or the editor removed part of the markup. Copy the product button snippet again and paste it into a custom HTML, custom code, or embed block.

If your builder has separate desktop and mobile layouts, check both. Some templates hide blocks on mobile or duplicate sections for different breakpoints.

The button appears but clicking does nothing

This usually means the Zwely script snippet is missing, blocked, loaded after another script error, or pasted somewhere the builder strips script tags. Add the script snippet near the bottom of the same page, or in a site-wide footer/custom-code area if your builder supports that.

If you use cookie consent, privacy, or script-manager tools, make sure the Zwely script is not waiting for a marketing-cookie category before it can load. Checkout should be treated as functional commerce code.

Checkout opens the wrong product

Each Zwely product has its own product identifier in the embed code. If the wrong product opens, the page probably has an old button snippet or code copied from a different product.

Copy the latest code from the product you actually want to sell, replace the old snippet, publish, and test again in a fresh browser tab.

It works in one browser but not another

Start by testing in a private/incognito window. Browser extensions, ad blockers, privacy tools, and old cached JavaScript can make one browser behave differently from another.

If the issue only happens with a particular extension enabled, the buyer experience is probably fine for most visitors, but you may still want to test the page with common privacy settings before launch.

It works on desktop but not mobile

Check whether the website builder uses a different mobile section, popup, sticky footer, or button block. If the desktop and mobile sections are separate, paste the Zwely button snippet into the mobile version too.

Also check whether another mobile element sits above the button. Cookie banners, sticky menus, chat widgets, and newsletter popups can intercept taps even when the button looks visible.

The modal opens but payment is not ready

If a paid checkout opens but cannot take payment, go back to the product embed step and confirm Stripe is connected. Zwely can show checkout setup before live payments are connected, but real paid checkout needs Stripe Connect.

For free products, no payment step is needed. For paid products, the connected Stripe account is what lets the buyer pay and lets payouts go to you.

The modal opens but delivery feels incomplete

Embedding controls where checkout appears. Delivery comes from product setup. If buyers should receive a file, make sure the product has an uploaded deliverable file. If buyers should receive a license key, make sure the product has keys available or auto-generation enabled.

Use the product preview, delivery email preview, and a test checkout to make sure the buyer sees the same promise in checkout, email, and download/license delivery.

The page builder strips script tags

Some builders allow HTML but remove scripts from ordinary content blocks. Look for a dedicated Custom Code, Embed, Code, HTML, or Footer Scripts area. If your plan does not allow custom scripts, the builder may not support embedded checkout without upgrading that builder plan or using a different page.

If a builder gives you separate places for header code and body code, put the Zwely script where scripts are allowed and put the button snippet where the button should visually appear.

Optimization plugins break the embed

Performance plugins sometimes delay, combine, minify, or defer JavaScript in ways that break third-party embeds. If the button stops working after enabling optimization, exclude the Zwely script from delay/defer/minify rules.

This is common on WordPress sites with caching or optimization plugins. Test once with optimization disabled, then re-enable settings one by one.

Content Security Policy blocks Zwely

Some sites use a strict Content Security Policy that only allows scripts from approved domains. If the console mentions CSP, add Zwely's script host and checkout/API domains to the allowed script/connect/frame rules your site uses.

CSP settings are usually managed by a developer, security plugin, hosting panel, or custom headers. If you are not sure, send the console error to the person who manages your site.

The builder preview is misleading

Preview mode is useful for layout, but not always reliable for scripts. Some builders run previews inside iframes, block external scripts, or use a temporary preview domain that behaves differently from the published domain.

When testing checkout, trust the published page more than the editor preview. Publish to a hidden or draft URL if you are not ready to send traffic yet.

What to send support if you are stuck

Send the public page URL, the website builder you are using, whether the button appears, whether clicking opens anything, and a screenshot of any browser-console error. Do not send private Stripe keys, API keys, account passwords, or raw customer information.

If you can, also mention whether the embed works on a blank test page. That one detail usually tells us whether the issue is product setup, the embed code, or the surrounding website template.

Good to know

  • If the modal opens, the embed is basically working. Product details, delivery files, license keys, discounts, and payment readiness are controlled from the product settings in Zwely.
  • Use one product code per product page. Reusing old embed code is the fastest way to accidentally open the wrong checkout.
  • Do not paste Zwely embed code into an email campaign. Most email clients block scripts. Link email subscribers to a landing page that contains the embedded checkout button instead.
  • If your builder cannot run custom scripts at all, use a normal link or button to send buyers to a page that can host custom code, or contact support about the best workaround for your stack.