Skip to main content
When the user is ready to checkout, you will redirect them to the Fourthwall checkout page. This is where they can review their order and enter their shipping and payment information. Checkout page It’s best to style the checkout page so that it matches the rest of your store. This will help create a seamless shopping experience for your customers. We recommend using a simple theme like Clean Frame and then setting the styling (colors + typography) so that it matches your main store. You can style your checkout process here. You will also want to connect a custom domain like checkout.<your_store>.com to the checkout page so that the redirect from your main store is seamless. You can connect custom domains here. In the Vercel starter kit, you can add the checkout domain (custom or otherwise) to env.local under NEXT_PUBLIC_FW_CHECKOUT. If you are building your own frontend, redirect to: 
https://<your_checkout_domain>/checkout/?cartCurrency=<currency_code>&cartId=<cart_id>
Alternative domain entrypoint: 
https://<your_shop_domain>/cart/checkout?cartId=<cart_id>&currency=<currency_code>
For /cart/checkout details (including direct product links like products=variantId:quantity), see Cart Checkout Endpoint. The emails sent from Fourthwall can sometimes include a link to the Fourthwall (checkout) page. When a user clicks on this link, you will want to redirect them to your domain. You can add a redirect script to your Head component here. 
<script>
  // Get the current path of the URL
  const currentPath = window.location.pathname;

  // Check if the path is not '/checkout'
  if (currentPath !== '/checkout') {
    // Redirect to the desired URL
    window.location.href = 'https://your-storefront.com/'; // Your site here
  }
</script>