This article will cover connecting your existing site to Cratejoy’s subscription checkout tools. While Cratejoy does offer a complete solution for creating a custom storefront, this is commonly done by sellers that want to create their front-end website using another platform (WordPress, Wix, Squarespace, etc.) and simply use Cratejoy for the checkout process and backend management system.
Please note that this article does require custom coding/development on your 3rd party site which Cratejoy Support is not able to directly assist with.
In this article:
What do I need in order to integrate Cratejoy into my existing site?
- A site on a 3rd party platform (for example, WordPress, Wix, Squarespace, etc)
- A Cratejoy seller account on either the Checkout-Only or All-in-One plan. You can sign up here
- An installed and published theme in your Cratejoy account. You can learn about installing a theme here
- An active subscription product in your Cratejoy account. You can learn about creating a subscription product here
- (Optional): access to the domain you are using for your 3rd party site if you wish to use a subdomain with your Cratejoy store (like subscribe.yourstore.com). You can learn more about customizing your domain here
How do I integrate Cratejoy into my 3rd party site?
Through custom development, there are a number of different ways that you can integrate a Cratejoy product, but there are two main categories of ways to accomplish this.
The first way this can be done is to simply link to the subscribe flow for your Cratejoy product(s) and using your installed theme in your Cratejoy store for the entire subscribe process, including any product, variant, survey, and term steps.
The second method is more complicated and requires using what are called "add-to-cart URLs" which are links that you can use that will automatically add a product to a cart and take the customer to checkout.
We will cover both scenarios in this section.
Linking to a Cratejoy subscribe flow (easy method)
- Access the designer tool for your installed theme. This can be found on the Subscribe tab by clicking Designer next to your installed theme
- Select Subscribe from the page navigation in the upper right
- Using the designer tools, style this page to your preferred design. You will also want to style the 'Checkout', 'Account Details', 'Account' and 'Thank You Page' pages in the same way as your customers will use Cratejoy's backend pages
- Determine your subscribe flow link. This can be done by going to the Domains Settings page. The link you use will depend on whether you are using the built-in Cratejoy domain or a custom domain that you have mapped to use with your Cratejoy store
The subscribe flow link is the domain you are using plus "/subscribe". In the example above, the URL would either be cratejoy-support.cratejoy.com/subscribe or subscribe.cratejoy-support.com/subscribe
- On your third-party site, you would just create a call to action to, for example, "Subscribe" and have the link that you use be the URL you found in step 4.
Using add-to-cart URLs (advanced method)
For some sellers, the goal is to use their existing site for as much of the purchasing process as possible, using on the checkout and customer pages on the Cratejoy backend. For these sellers, they are still using links to the Cratejoy backend, but only links that result in a product being added to a cart with all of the variant and term information included.
The reason this method is more complicated is that for any product, the number of add-to-cart links grows depending on the number of terms and variant options. For example, if one product has to variants (size and color for example) and each variant has 3 options, there are 9 potential links to add the product to the cart, depending on the selections.
The basic format for these add-to-cart URLs is:(yourstore.cratejoy.com/subscribe/<PRODUCT_ID>/<VARIANT_CHOICE_1_ID>/<VARIANT_CHOICE_2_ID>/)
The easiest way to get these URLs is actually to use your installed theme in your Cratejoy store following these steps:
- Click on the Design tab in your Cratejoy Seller account
- Click on the thumbnail image next to your installed theme. This will open a preview of the site.
- Click on the subscribe button
- In the subscribe flow, make the product, variant, and term selections until you are at the last step before the product is added to the cart.
- Right-click on the final option call-to-action and select 'Copy Link Address'
This copied link will be the URL that will take a customer to checkout with the product and all of the options you selected already added. You will need to repeat this process for all of the possible combinations of choices, but once you have those, you can develop pages that mimic this subscribe flow on your 3rd-party site
Please note: Even if you do integrate in this way and use just the cart page during checkout, customers will still need to use the Cratejoy backend for Customer and Account pages to manage their subscriptions. You will still want to use the Cratejoy Designer to style these pages to be visually similar to your 3rd party site