Single Page Checkout
Single page checkout forms are great for those that want to embed a checkout form on a sales page. Single page checkout forms are also great for lead magnets, trip magnets and more.
Below will be a step by step guide to get you started with North Commerce's single page checkout forms.
- 1.
- 2.Find the product id <-- this is the number after the - on the product title. It can also be found in the URL of the product after you have created or saved the product
3. Now you can add the checkout form shortcode to your sales page
[commerce-checkout-form product="product-id" redirect="URL-TO-THANKYOU-PAGE"]4. Replace the "product-id" with the id of your product and add a complete URL to redirect the customer to after they have completed their purchase. Once you have done that it should look like this:
[commerce-checkout-form product="7" redirect="https://my-awesome-website.com/thank-you"]Where 7 is the id of the product I want to sell and the url in redirect is where I want the user to end up after they have completed their purchase
Currently with the shortcode you are not able to set a default country. In the meantime while we work on this feature, if you want to set a default country to the phone number field you can add this block of Javascript in a code block directly underneath the checkout form.
<script>
document.addEventListener('DOMContentLoaded', function () {
const countryDropdown = document.querySelector('.phoneSelect');
countryDropdown.value = 'US';
const phoneInput = document.querySelector('.phoneInput');
phoneInput.placeholder = 'Phone'
});
</script>
Last modified 5mo ago