If you’re looking for a seamless way to sell your products or services directly from your website, learning to embed ThriveCart on your website is the answer. It’s a straightforward process that can significantly enhance your customer’s buying experience.

Unsure whether ThriveCart is worth your time? Read my ThriveCart 2024 review here.

Now, let’s crack on!

Why embed ThriveCart on your website?

Embedding a ThriveCart checkout on your store allows you to retain your existing site branding and url structure, while enabling the deep analytics and funnel capabilities of your ThriveCart checkout.

• Streamlined Checkout: No more redirecting customers to a separate checkout page. An embedded cart keeps them on your site, reducing friction and increasing conversions.
• Brand Consistency: Maintain a cohesive look and feel throughout the buying process, reinforcing your brand identity.
• Flexibility: Embed your cart on any page or post, giving you complete control over the placement and presentation.

How to embed ThriveCart

To embed a ThriveCart checkout on your existing site, you need to ensure that the funnel you are trying to embed is using one of ThriveCart’s ’embedded checkout’ pages — a standalone page will not allow this functionality.

If you navigate to the URL of your store and see an embed code, you’re good to go. It should look something like this:

How to build an Embeddable ThriveCart checkout

To start, you’ll want to login to ThriveCart and start creating a new Product. Walk through the typical product settings until you get to the Template Gallery. From there, you’ll want to choose the Embeddable checkouts:

Choose the template you like and start customising the journey like you would with your typical checkouts.

When you’re happy with your design, click ‘Complete’ in the top right of the editor to be taken to the Design panel. On the Design window, click ‘Save & get URL’

On the next page, you will see a small Embed code. This is what we’re going to use on our own website builder. You can click ‘Copy embed code’ and bring this over to your editor.

Embedding ThriveCart with a Convertri landing page

For this example, I have prepared a simple Convertri landing page template, but you can do this on any site that enables the embed of HTML elements.

As a quick aside: I would highly recommend Convertri if you’re wishing to build your checkout/sales pages outside of the ThriveCart ecosystem. The platform is extraordinarily fast, and has a dedicated Element for embedding ThriveCart pages.

Get a free 14-day trial of Convertri, the ‘fastest landing page builder’, here.

From the Convertri editor, I click on ‘ThriveCart’ from my list of page elements, which pops up a ThriveCart-branded embed box. I can then drag this box to wherever I like on page, including on conditional pop-up layers.

Click on this element, then click ‘ThriveCart Properties’, then on ‘Edit embed code’

Then click ‘Edit embed code’ and paste your ThriveCart embed code into the box.

You can then preview the embedded checkout to see how it looks.

Then we can preview the embeddable checkout on our page to ensure that it’s sized correctly and that everything works:

You can then input test information to see if the checkout works, that any automated steps are functioning, and that your ThriveCart success page looks great.

Tips to consider when trying to embed ThriveCart

• Choose the Right Placement: Consider the user experience and place the cart where it makes the most sense within your content flow.
• Customize the Look: ThriveCart offers customization options to match your brand’s style.
• Test Thoroughly: Always test the embedded cart on different devices and browsers to ensure it functions correctly for all visitors.

Troubleshooting your ThriveCart embed

• Display Issues: If the cart isn’t displaying correctly, double-check the embed code and ensure it’s pasted in the right location within your CMS’s HTML editor.
• Functionality Problems: If the cart isn’t functioning as expected, reach out to ThriveCart’s support team for assistance.

Embedding your ThriveCart is a simple yet powerful way to enhance your website’s sales potential. By providing a seamless checkout experience, you can increase conversions and boost your bottom line. So, what are you waiting for? Start embedding today!

Need help setting up your ThriveCart or optimizing your sales funnel? Contact me for a free consultation!