In this video you’ll learn how to setup and use the return to checkout feature of LaunchFlows.
This make it super easy to create long-form sales and checkout pages where the prospective buyer is returned to exactly where they were before modifying the contents of their cart.
You will also learn how to add a scroll to checkout link to allow someone to skip right to checkout.
1. Using the LaunchFlows option to add a checkout page, create a long form sales / checkout page using any post type, including if you wish, a product.
2. Add at least two call to action buttons or text links. The first will be to add the product to the cart for this checkout page. The second will be for scrolling to the #checkout section of the layout.
3. For the Buy It Now buttons, copy the LaunchFlows LF-Direct To Checkout link for the product you wish to sell, and paste it to the url for the first button. Be sure the product is configured to have this versy same page as the location for being redirected after the product is added to cart (Next Step option).
4. Create a second button that will be used for scrolling down to the location of the checkout.
5. Use the bookmark link of #checkout for this button.
6. Add the LaunchFlows block, shortcode or Elementor Widget for “lf-return-checkout”. This is what adds the javascript code to this layout for enabling the return to checkout feature.
7. Open up the gutenberg List View so you can convert this block into a group.
8. Right click on the lf-return-checkout block and choose “group” so that it becomes a Gutenber group block.
9. After selecting the new Group block, click the “Advanced” option on right side so that you can apply the HTML anchor tag of #checkout.
10. Click the “HTML anchor” field and type in the word “checkout” without the hashtag (Gutenber will add it by default).
11. To hide the WooCommerce coupon component from this layout, first click “LaunchFlows LaunchFlows Woocommerce Coupon”
12. Then click the “Additional CSS class(es)” field and type in “lf-hide”. This will cause the component to be hidden from the public side.
13. Repeat this for the Additional Fields component.
14. Switch to tab “Checkout 4 – Return To Checkout – LaunchFlows Patterns”
15. Test click the “Buy It Now!” button. The product should be added to the cart.
16. Then click the scroll to checkout button, and you should be taken to the checkout anchor location.
17. Where you can complete the order with the “Place Order” button.
18. Test to see what happens when you delete the product from the order review.
19. The checkout page/post should reload and return to the checkout position.