This feature lets you embed the Movement checkout into external sites and platforms. Combined with our new guest checkout functionality, new members can instantly sign up and purchase access to your app in one step, right from your website or external sales funnel, without prior registration. This streamlines the sign-up and purchase process, enhancing conversion rates and user experience.
How to Use the Embeddable Checkout
Navigate to your products in the Movement admin from the 'Sell' tab in the lefthand sidebar.
Choose a product and click on the "Share" button located at the top right corner of the product page.
Select "Embed" from the dropdown to access the direct checkout URL or to copy the embed code.
💡 Note: You will also see a ‘Copy Link’ option in this dropdown. This is a direct payment link that you can send to someone and it will take them directly to the checkout to purchase this product. You can view what this looks like from the ‘Preview product’ option.
4. Copy the provided iframe code to embed the checkout on your external site. This makes it easy for customers to sign up and purchase access to your app without leaving your site.
Example of iframe code:
5. Embedding on Different Platforms:
The specific steps to embed the iframe will vary depending on the platform you're using. This process can be adapted for other website builders or content management systems that support custom HTML or iframe embedding.
Not looking right on your website?
You may need to set the height manually.
See below for instructions
This may be something to do with how Website builders (e.g. Squarespace and Wix) lays out their custom blocks.
You could try setting the pixel values directly in the "width" and "height" parameters in the code that is copied from Movement.
So, it may look something like:
<iframe src="https://coach-abc.mvt.so/buy/9566" width="800px" height="400px" style="border: none" frameborder="0" allow="payments fullscreen"></iframe>
Notice the width="800px" and height="400px" properties. You can change these to any other pixel value that suits the page you are embedding this on.
💡 Note: Most website builders offer some way of embedding content hosted elsewhere. For example, Squarespace has an embed block and Wix has an Embed element
Here is a live example of a checkout embedded using our own embed block:
Warning: This is a live product, please do not purchase.
<iframe src="https://learn.mvt.so/buy/2047" width="100%" height="100%" style="border: none" frameborder="0" allow="payments fullscreen"></iframe>
Adding multiple products to an Embeddable Checkout
If you’d like to display multiple purchase options in the one embedded checkout you can easily do this by following these steps:
Gather the Product ID(s) of the additional Product(s) you’d like to add to an embeddable checkout. The product ID can be found by navigating to the product in the ‘Sell’ tab, then scrolling down and expanding the ‘Advanced’ section.
Add these product ID(s) into the URL in the src attribute after the first product ID, separated by a comma. See image below for example.
Here is a live example of an embedded checkout with two product IDs:
<iframe src="https://learn.mvt.so/buy/2047,6333" width="100%" height="100%" style="border: none" frameborder="0" allow="payments fullscreen"></iframe>