Add an install popup to Carrd — setup guide

Key takeaways

• Use a hidden Code embed, not a URL or iframe embed.
• Carrd Pro Standard or higher is required.
• Test the published page, not Carrd’s editor preview.
• Home-screen guidance is not a guarantee of offline access or web push.

Before you start

• Carrd Pro Standard or higher.
• A published HTTPS site.
• An InstantPWA popup with the exact published site address saved.

Step-by-step for Carrd

1. Step 1
   Create the popup for your published address

   In InstantPWA, save the Carrd address visitors use. Match your name, icon and font, then copy the install code from your popup. Replace YOUR_WIDGET_ID in the example with your own ID.

   <script src="https://instantpwa.com/api/public/embed.js" data-widget-id="YOUR_WIDGET_ID" defer></script>

2. Step 2
   Add a hidden code embed

   Add an Embed element in Carrd. Choose Type: Code, paste your script and choose Style: Hidden. Select Body End so the script runs in the page rather than inside an iframe.

3. Step 3
   Publish and check the live page

   Publish to your Carrd subdomain or custom domain. Open that same address in a fresh browser session, then use InstantPWA’s install check. A successful snippet check confirms the script is present, not that every PWA capability is available.

4. Step 4
   Test the home-screen experience

   On iPhone, open the published page in Safari and follow Share → Add to Home Screen. On Android, use Chrome’s available install or home-screen action. Open the new icon and check where it launches.

Common Carrd gotchas

• Pro Lite does not include the custom code Embed feature.
• An iframe embed isolates the popup from the page; use a hidden code embed.
• Carrd does not expose a general-purpose root-file upload. A worker hosted on another domain cannot control the Carrd page.
• A dismissed popup may stay hidden until its frequency setting resets.

FAQ

Platform documentation

• Carrd: embedding custom code