Designing Elementor Checkout Page | JetWooBuilder plugin
Vložit
- čas přidán 25. 06. 2024
- Build Elementor checkout page in 5 minutes, using the powerful #JetWooBuilder plugin.
Tip 1.Don’t forget to enable Custom #Checkout to make everything work just fine.
Tip 2.Elementor #WooCommerce checkout page consists of two templates: Main Checkout template, displaying primary checkout info, and Top Checkout template, including Coupon and Login Form widgets.
Continue watching to know how to:
🧨 Create billing form with the help of Checkout Billing Form widget
🧨 Provide some extra details about the order, using Checkout Additional Form widget
🧨 Add shipping form to your Elementor checkout page template for the customers to provide the address
🧨 Organize the order details in a clear-cut table with the help of Checkout Order Review widget
🧨 Offer comfortable payment process, using Checkout Payment widget
🧨 Enhance WooCommerce checkout page design - change headings, add account label, fine-tune typography and apply other super-easy styling options
🧨 Make the column with order’s summary sticky while you scroll the section
🧨 Design Checkout Top template - add login form and possibility to enter promo code, change the text and style according to your needs
Remember that for Checkout Top, only Checkout Coupon and Checkout Login Form widgets will work properly.
That’s it for designing the Elementor Checkout Page. Stay updated because more useful tutorials are coming soon.
-------------
☕LIKED THIS VIDEO? BUY JULIA A COFFEE
► www.buymeacoffee.com/JuliaMcHale
-------------
► TIMESTAMPS
00:00 Introduction
00:34 Creating Checkout template
01:24 Applying the widgets and styling them
04:48 Adding Checkout Top template
05:50 Assigning the templates to the pages
-------------
Useful links from the video:
👉WooCommerce playlist bit.ly/3ch2siy
👉 Building Elementor cart page • Designing Elementor Ca...
👉 Creating Elementor shop page • Creating Elementor Pro...
-------------
Discover JetWooBuilder
► features on our website bit.ly/3d9D2Ua
► tutorials in our Knowledge Base bit.ly/3rHp9kb
---------------
Website template used: Zolden - Dynamic WooCommerce Template
► bit.ly/3tLi2Jx
---------------
Explore JetTricks
► bit.ly/3tMY5ly
---------------
Learn more about Sticky Column widget
► bit.ly/2MLfUAX
---------------
Join us here:
► FB Community: / crocoblockcommunity
► Facebook: / crocoblock
► Twitter: / mrcrocoblock
► Instagram: / mrcrocoblock
► Pinterest: / crocoblock
#billingform #elementor #checkoutpage #checkouttemplate #woo #ecommerce #shop #website - Věda a technologie
keep em coming guys
Great videos. Please conutinue your great work!!! We need you!!!
Hi! Thank you so much for your feedback and kind words!
Great tut! Is there a functionality in crocoblock to have a checkout with a option to choose a delivery time slot (and a max. on orders per timeslot). It would be great for online food businesses?
Hi! Right at the moment, this option isn't available. Please, feel free to submit a feature request to Git repository github.com/CrocoBlock/suggestions and our team will explore if it's possible to implement.
Hello crocoblock, loving the plugin. I am having an issue on my checkout page. I created it and on the settings menu of Woocommerce I changed the custom checkout page to the new page. But I can't see the changes. When I check my pages, the original checkout page is still there. What should I do? Thanks!
Hi! What we can suggest is clearing the cache and contacting us here crocoblock.com/help-center/ so we can investigate :)
Great Tutorial! I would like to ask if it is possible to translate these templates (for Checkout & Thank you page) with WPML. They work out of the box with the translated strings, but what if you need to add an extra section that is different for every language. They do not seem to be translatable but they show up at the WPML post types translation section as "not translatable". So I guess that I will be able to translate them if they are set to translatable? Thanks.
Hello! Please kindly contact our Support team at crocoblock.com/help-center/ and we'll help you out.
Vrery good
Great video! Can I edit the checkout form fields using this plugin? For example, can I remove the default WooCommerce "Company" field?
Hi! Unfortunately it is not possible :)
You can change it within woocommerce if I remember correctly
Hi when i do this 1:15 the sidebar bothers on the right side, is there any way to turn it off using jet woo builder? because i dont want a distracting sidebar on my checkout page...
please i need a way to fix this or just a guide
i ve trying to create this page with two diferents theme ( generatepress, and Neve) the Checkout Billing Form fields are too small, when i change to kava it ok. as you said it s compatible with generatepress !!
Hello! Yes, we have compatibility with Generate Press theme. Please submit a ticket at support.crocoblock.com/support/tickets so the Support team could check it. Thank you!
If I use Stripe payment gateway can I avoid all the unnecessary fields and just use the name, email, and card details (number, date, security number)?
Hello! Our widget pulls default payment methods available in WooCommerce
Nice tutorial, but could you also show how to make it responsive in future video's?
Thank you for the suggestion! The creative team will think on that :)
@@Crocoblock thank you!
Everything perfect on desktop but not on mobile and tab, a lot of crocoblock user have same issue, Please help us by making videos on how to make these page responsive checkout page, cart page, OR make everything separate like single product page so we can customize according to our needs.
Is there a way to add the Coupon Form Widget directyl to the Checkout Template instead of Checkout Top Template?
Hi! Please, contact our support on this issue - crocoblock.com/help-center/
Why I can't copy and paste the customized My Account widgets to a new page template? It copy them but they loose all the customization when I paste them. Please help.
Hello Federico! Please submit a ticket at support.crocoblock.com/support/tickets and our Support team will be glad to assist :)
i cant make this page look full width as i have the sidebar on the right side, how can i take it out? thanks
Hello! Please kindly contact our Support team at crocoblock.com/help-center/ and we'll help you out.
What about shipping method? Is it possible to add it to checkout page by this plugin?
Hi! You can add it with the Checkout Shipping Form widget prnt.sc/1uw3xmt
Is it possible to create checkout page without Checkout Billing Form widget?
Yes, it is possible. Just do not add this widget.
can I add the image of the product on the checkout page?
Hi! Unfortunately, there's no such opportunity.
@@Crocoblock I hope you can add this option in the future
@@Zii73 Please, feel free to submit a feature request to Git repository github.com/CrocoBlock/suggestions and our team will explore if it's possible to implement.
I get validation error, why this error happened and how can i solve it?
Let our support team to investigate this issue on your website: crocoblock.com/help-center/
Does not work with woocommerce germanized
Hi there! :)
As this is a third-party plugin, we can not provide compatibility with it 🤔
@@Crocoblock yeah i get that. But almost every german shop is using it to be conform with german law. I dont know how many german clients you have, but for those at least you could mention that it wont work.
@@hoodboyslim Could you please submit a feature request here github.com/CrocoBlock/suggestions/issues so the developers could take a direct look at it?😊
not working at all
Could you please provide more details on what exactly is not working for you?
The checkout page and also the cart page built by JetWooBuilder are not responsive at all so it's just useless. Please make it responsive. Thank you.
All the templates are responsive: prntscr.com/105kuzt. If you need our assistance, please contact our Support team crocoblock.com/help-center/
There are no templates for checkout and cart page, and if we build from scratch it's not responsive.
@@mohammedbenmoussa5969 Please submit a ticket at support.crocoblock.com/support/tickets and our Support team will help you out.