JetFormBuilder Crash Course

Welcome to our Jet Form Builder tutorial! In this comprehensive guide, we will walk you through the step-by-step process of creating stunning and highly functional forms using Jet Form Builder.
Whether you're a beginner looking to build your first form or an experienced user seeking advanced form customization, this tutorial has got you covered. We will cover everything from form design and field configuration to form validation and submission actions.
Learn how to leverage the powerful features of Jet Form Builder, including conditional logic, multi-step forms, and integrations with popular email marketing platforms. We will also explore the various styling options available to make your forms visually appealing and on-brand.
Follow along as we demonstrate how to set up form fields, apply form validation, and customize the form appearance using Elementor and Jet Style Manager. You'll discover tips and tricks to enhance user experience and maximize form submissions.
Whether you're creating contact forms, registration forms, or complex application forms, Jet Form Builder empowers you to build forms that meet your specific requirements.
Subscribe to our channel and hit the notification bell to stay updated with our latest tutorials and tips on web development. Don't forget to like and share this video with others who may find it helpful.
Thank you for joining us on this Jet Form Builder tutorial journey. Let's dive in and create amazing forms together!"
Timecodes
0:00 - intro
0:40 - install jet style maneger
1:20 - create new form
1:49 - how to name your form
1:59 - how to add fields to your form
4:53 - how to delete a field
6:08 - arrange fields
8:31 - setting side
10:00 - field settings(block tab)
15:29 - lets create a form
22:24 - repeater field
24:14 - how to set fields as required
24:34 - add a form to elementor
27:47 - select field(using glossaries, autocomplete)
31:45 - conditional block
34:19 - date and time field
37:18 - terms and conditions checkbox
39:19 - submit/action button
39:42 - styling your form
42:21 - media placeholder
44:05 - break fields
47:50 - progress bar
51:12 - post submit actions
59:45 - reusable blocks
1:00:25 - convert jet engine form to jet form buider form
1:01:29 - outro

the code page:
filenewcreate.com/elemento-code/
macros:
date field:
'%CT::CurrentDate|toDate%'
time field:
'%CT::CurrentDate|toTime%'
space character(for the terms and conditions checkbox):
 
jet form buider converter:
github.com/Crocoblock/jet-for...

[@pixelgap]

Best tutorial ever on Jetforms. You have covered everything. Thank you my friend.

[@crocomentor]

Thanks, I really appreciate your feedback.

[@jenniferward6821]

Absolutely hands down the best tutorial on JB forms - bless you!!!

[@crocomentor]

Thank you so much for the positive feedback! I'm glad you found the tutorial helpful , I put a lot of effort into creating it

[@jeaniusworks]

Fantastic tutorial video! Thanks for being so thorough. You answered all my questions.

[@gieselman]

absolutely fantastic demo. I learned a LOT! Thank you.

[@aymericzambo1914]

How you added the terms and conditions hyperlink was pure magic! I would've clappled if you were presenting this in a seminar or something. Pure gold! Loved it!

[@crocomentor]

Thanks, brother. I really appreciate your kind words!

[@mohammad-omar-07]

❤ Thanks for this Tutorials.

[@maworld4577]

Thanks for the brief explaination of Jetform builder.

[@MaryMaguire01]

Thank you so much for doing this tutorial.

[@Sailing_SY_Melody]

Hi there... Really, I learned a lot with this video, thank you... Even better and cleaner explanations than Croco Tuts itself.

[@crocomentor]

Thank you! I'm glad you found the video helpful. It took a lot of effort. Appreciate your feedback!

Thank you so much!! You are a genius! Great tutorial!

[@mdemran03]

thanks a lot, very helpful video for me as a beginner

[@basketballforce]

This is amazing. Thank you!

[@tarados239]

I have checked out others explaining jetformbuilder and even other jetengine features. But, I prefer yours. I find all your videos useful. Thank you so much

[@crocomentor]

Thanks a lot, I'm really glad to hear that you find my tutorials useful

[@tarados239]

@@crocomentor Can you do a quick video to show how you created the HTML email using AI and inserting into Jetformbuilder (at 55:34 in your video)? This provides an enhanced brand experience.

[@Art-01]

Thank u for sharing

[@alizex2880]

thank u love

[@dragon3602010]

Awesome thanks, is it possible when i click on the labels, it's go to the respective inputs ?

[@comleonmoto]

Really nice tutorial, thanks you, good job! For a video that long, I would recommend using chapters (timing). It make searches easier 😉.

[@crocomentor]

I'll definitely be adding chapters to the video soon.

[@Alex-hf7ic]

You don't have to refresh the Elementor editor if you just want to preview a change made in the JetFormBuilder. You can just refresh the page the form is in. There's no point in refreshing the Elementor editor just to click the preview button unless you added a field and want to see it and make changes to it in the editor.

[@sudebkarmokar]

informative

[@RemayPesca]

Great tutorial! 😀You should also include how to make calculations. I was hoping to see it on this tutorial. 😔 You won a new subscriber! Thanks.

[@crocomentor]

Thanks a lot for subscribing! 😊 You're absolutely correct, and I appreciate your feedback. I should have covered calculations in this tutorial. Rest assured, I'll definitely consider creating a tutorial focused on calculations in the future.

[@RemayPesca]

@crocomentor I'll be waiting for it. Thanks again!

[@HelaG50]

I have two forms. The second form takes presets from the first form. I have a textarea field in the first form which I need it to be converted into a checkbox field in the second form (One line in the textarea field becomes one checkbox field in the second form). Can you direct me to the resource which can help me do this even if it is a code?

[@user-ro2vo4lq1g]

Excellent tutorial! Looking for a way to implement an exact search in JetSearch: if user is searching for "book" - he will only get "book" and not "booking". Could you please kindly suggest the way to make it?

[@pixeleartebr]

and how to calculate repeating fields I have a number field that is "Quantity". and the other is unit value... that is, it would be "quantity" multiplied by the unit value of that item. and as it is an item that will be added to the repeater, it would be several items, accompanied by "Quantity x Unit value". How do you calculate it?

[@Art-01]

Please make videos from Croco. Like Jetbooking, add date and time. Possible to create own back end booking system with possiblity add calender, order in back end oct… Thank u

[@user-rb5tg7kd4v]

Hello, very clear and good explanation..I have a question..how can i set up conditional fiel in calculated field? Because some fields are equal in depens onbooking tours but calculator is not working..solution please..

[@factsandnews4102]

Very informative video...thanks ! I know have an issue if you can help please... I would like to copy a field value to another field value... I have builder a form to upload post from front-end and modify it. When i use field to update taxonomie it doesn't preset properly on "modify form". So i want to use the same value of a field to update meta date and terms (taxonomy)...but still now i can't find a way to copy a value field inserted to another field value....regards.

[@ramaslan]

Your videos are excellent, thank you for this. I would like to ask a question. Let's say a user enters a URL from external sources on Jetformbulder. How can we know if this URL is infected with viruses? Let's say, the url of the facebook profile must be entered and the user enters his own url, not on facebook, how can we make these better for security in jetformbulder?

[@MarkoKozlica]

Hello, thank you for the tutorial, it is high quality content. I have a question for the existing CPTs and meta data, did I miss the video where you create them or...? I see that you use them for the car info where you select brand terms... thx

[@crocomentor]

Thank you; I put a lot of effort into this tutorial. Regarding your question, I believe this is the video you're looking for. kzbin.info/www/bejne/h6esgpt8ideSl7M

[@AlexanderLugoIng]

Do you have a demo of the address autocomplete addon?

[@gieselman]

can someone help me understand the purpose of the underscore?

[@88ikky]

Hey! Thank you for your tutorial. However, the media field placeholder is not removed after uploading an image. Any idea why?

[@crocomentor]

Yeah, I see what you're saying. I'll make sure to fix that up in the future. In the meantime, here's another option you might like even better. Check out the KZbin video here:kzbin.info/www/bejne/ooDKma2CnrdqabM. Thanks for letting me know!

[@rmyantilable]

Hello, your video is very good but I have a question, the checkbox field that you have in the CPT and form I saw that in the video the data was not recorded when you did the process, could it be an error in the process?

[@crocomentor]

Thank you for your feedback on the video! the issue is not an error in the process but rather a setting in the meta field. To resolve this, please follow these steps: Go to the checkbox meta field you created for your cpt in the backend of your site. Ensure that the "Save as array" option is enabled. This should resolve the issue and ensure that the data is correctly recorded.

[@crocomentor]

prnt.sc/xh3Sx1tqOQu4

[@vendajuntos]

JetEngine is compatible with Dokan?

[@MattyPod27]

Is it possible to use jetform builder to use it as a selector for woocommerce product variations ? I would like to custom the style of my products variations and get rid of the the selector by default to make some button that select the right variation. Thanks for the content

[@crocomentor]

Not to my knowledge. You might want to consider a plugin for that. Maybe this video will help: wordpress.org/plugins/woo-variation-swatches/

[@MattyPod27]

@@crocomentor Hi, thanks, i've tried it but it does not allow me to customize it, excepts maybe with code. I wanted to try it out with JetForm and their Advanced Choices Field Block to not super charge my website with lots of plugins. Have you used this option ? Not many ressources about that :)

[@crocomentor]

I havent used this option If you're looking for more advanced customizations, you might need to dive into the code. Sorry, I can't be more helpful on this one.

[@habarizenuTV]

When you use the suggested media placeholder....After uploading your own image...it does not reflect your own newly uploaded file.... one will think the new file is not uploaded because visually it doesnt reflect as it does with the basic settings...showing a small thumbnail of the newly uploaded image ugh- All these 'upgrades" are a waste of time...

[@crocomentor]

it works on my end, but here is another option for you kzbin.info/www/bejne/ooDKma2CnrdqabM

[@lasmaskotas5698]

The media placeholder code didn't work for me :(

[@crocomentor]

filenewcreate.com/lasmaskotas-2

[@jenniferward6821]

Hi where did you get the code for the image place holder??

[@crocomentor]

everything is in the video description here you go: filenewcreate.com/elemento-code/

[@jenniferward6821]

You’re a champ. Thanks so much.

[@jenniferward6821]

Please do a tutorial on how to manipulate uploaded pictures into a defined shape. Like when you upload you pic for profiles you can manipulate it to best advantage?? My clients will upload pictures to the form and it would be great if they could position it to best advantage. Have trawled the internet there is nothing Many thanks.

[@crocomentor]

Check out this website, I think it has what you're looking for. Unfortunately, it's in Portuguese (you can use Google Chrome to translate it), and it comes at a cost of about $10 after applying the coupon for one site annually. It is sold as a plugin, and there is a demo available on the site to see its functionality in action. plugins.dantetesta.com.br/

[@elyashivk1165]

אני מנסה לנחש שיש לך מבטא ישראלי