All Collections
Integrations
Wrapper vs Embed: methods for creating a PWA with no-code platforms
Wrapper vs Embed: methods for creating a PWA with no-code platforms

Learn how to use Progressier for your web app and the pros and cons of each integration method

Kevin Basset avatar
Written by Kevin Basset
Updated over a week ago

Solution 1: The Wrapper

For no-code platforms that won't allow you to add a service worker to the root of your domain, Progressier creates PWAs by wrapping your app with our custom PWA functionality. It comes with a few drawbacks:

  • In standalone mode, it shows the final URL of your domain in a header

  • It won't let you use some of our Widgets

To use this solution, navigate to Danger Zone > Advanced Options in your Progressier dashboard and disable Integrate as embed.

Solution 2: The Embed

Alternatively, we can display your app in an iframe. It solves the problems listed above, but it also comes with drawbacks of its own:

  • You'll have to ensure your domain allows embeds (we show you how to do that with Squarespace and Webflow below).

  • Browsers have restrictions regarding cookies in iframes. Any functionality that requires cookies in your app may break (this includes login forms, shopping carts, preferences, etc).

To use this solution, navigate to Danger Zone > Advanced Options in your Progressier dashboard and enable Integrate as embed.

Allow Embeds With Webflow

  1. Open the Webflow Dashboard and go to the Settings of the app you want to modify.

  2. Navigate to Hosting > Custom Domains. There, you'll have to follow Webflow's instructions to connect your domain. This is important. You won't be able to embed the default .webflow.io domain as it has additional security measures that prevent embedding altogether.

  3. Once your domain is connected, scroll to Hosting > Advanced Publishing Options and make sure Use Secure Frame Headers is off (it's already off by default).

  4. If you haven't yet, remember to Publish your project to your custom domain, then add this domain as Embed URL in Progressier.

Allow Embeds With Squarespace

  1. Open your Squarespace Dashboard and select the site you want to modify

  2. Navigate to Settings > Advanced > Website Protection and disable Clickjack protection. This will allow your site to be embeddable in an iframe.

Did this answer your question?