Are you having issues with your embeddable checkout not loading on your website?
Are you getting a continuous loading animation?
Below are the primary reasons for this behavior:
1. Broken custom domain (CNAME) records
If you have previously enabled a custom domain on your account and those CNAME records no longer exist with your domain/hosting provider, this can prevent your embeddable checkouts from loading.
The first thing you can do is go to your Settings > Account-wide settings > CNAME and check if you have a custom domain enabled.
If you do, you’d then want to go to a service like whatsmydns.net and enter your custom domain (e.g. abc.yourdomain.com) into the search field, choose CNAME from the dropdown, then click search.
This will then give you the results from around the world and you should see alias.thrivecart.com if this is setup correctly (see example below)
Some may show up with an “X”, like above, but as long as the majority are showing with checkmarks, you should be good. If everything is showing with a red X, this is indicative that your CNAME records no longer exist.
You will either want to remove the custom domain from ThriveCart OR resolve the missing records and set this up again in your domain/hosting provider – note these are not managed by ThriveCart and this is not something we can set up or change for you.
2. Checkout template not set to embeddable
This behavior is more common when you initially set up your checkout as an embeddable template, get your embed code and add this to your site, and then later you edit your product and change the product template to a non-embeddable template (URL-based).
Non-embeddable templates are not supported as embeds, and what should happen for most users is that the page the checkout is embedded on will refresh, loading the checkout page itself directly. However some browsers may prevent that redirect from occurring – creating what appears to be a continually loading animation.
The solution for this is to ensure that your product is set up to remain as an embeddable template IF you’re wanting to embed it inline within your page content. OR remove the embed code from your website and use a button to link to the checkout URL you’re provided for a URL-based checkout.
To adjust the template type, you’ll want to head to your product within ThriveCart > Checkout > Design > Browse Gallery (by hovering over your checkout preview image). You will see a warning that choosing a new template will override your existing design, this cannot be undone and you will need to re-design your checkout.
From the Gallery, you can then select an embeddable checkout template style to design the contents of your checkout, and then when saving your product you will receive an embed code. We recommend copying this code and placing it onto your website fresh, just to ensure that the code is correct.
See more on choosing your cart template & design here.
3. There are broken scripts trying to load on your website
It’s worth noting that the ThriveCart checkout will load last, after all other elements on your custom page have already been loaded. An embeddable checkout is technically loading a completely new website within the existing website, and so the user’s internet connection, location, and other variables can impact the load time. ThriveCart checkouts typically load within 2-3 minutes, but this depends on a number of factors such as customer location, internet connection, and the speed of your existing resources loading on your website.
When loading up your page, you’ll want to review whether there are a number of scripts that are attempting to load, and you’ll want to clean up your page and any unnecessary or broken scripts on that page that are causing your page to reload continuously – which in turn could be preventing the checkout form loading.