Do you want to support my channel? Leave a like or buy Divi / Elementor Pro with 10% discount via the link below. That will help me enormously to create these free videos for you and keep going!
⇒ Software that I recommend:
✅ Divi with 10% discount
✅ Elementor Pro
✅ SiteGround 70% discount
✅ WP Rocket 10% discount
I want you to succeed with your website, so lets get started.
📖Transscript📖
Hey guys! It’s WPress Doctor here, and in this video I’m going to show you how to create three different Gravity Forms. We’re going to create a really simple Gravity Form with your name, your email and a field where people can ask a question to you. We’re going to create a advanced forum with all kinds of conditional logic, so you know exactly how that one works. And we’re also going to create a crazy form, which contains all of the advanced fields of Gravity Forms. But not only that, we’re going to add a signature field so people can actually sign your form, and we’re going to add a PDF option so that it will be automaticly put into a PDF and sent to your client, and to you as the website owner. I’m also going to show you how you can add some CSS to change your Gravity Forms button and style them. It’s going to be awesome. I assume you already have Gravity Forms. If you don’t have one, there is a affiliate link in the description of this video, so you can get it. Let’s start with this tutorial.
So login to your WordPress dashboard. Let’s go to ‘Forms’ on the left side and click on ‘Forms’ again. This is your Gravity Forms overview of all the forms we have created. There are none yet so we’re going to create one. If you do not see this screen but you’re looking at this screen, then you are using an old version of Gravity Forms my friend! And what you need to do -no worries- just go to this video and you will learn exactly the same but in older versions of Gravity Forms. Alright. But when you’re looking at this screen then let’s click on ‘Add New’. And we’re going to start to create a new form. So let’s give it a title. The title is only for you. So let’s create “Simple contact form” and the description is also only for you. “The form for the contact page”. And press ‘Create Form’. Welcome to the Gravity Forms builder. This is a awesome, simply drag and drop builder from Gravity Forms. It is really easy. On the right side, you can see all these standard fields such as texts, checkboxes, radio buttons, phones. ADvanced fields we have over here with names, date, time, phone, addresses, website, we have post fields also, which is very interesting, we’re going to cover that later on. And of course we have pricing fields with products quantities. So, let’s start with the first one, the single line text. If you want to create a really simple contact form. Then, the first thing we want to know from our customers is their name. Now you can choose this one, the ‘Advanced field’ Name, but as you can see, when I add it, we get two fields, the first and last name. Now, when talking about conversion optimization, I always say, less is more. Because the more space you need in your form, the more space it will take up in your customers mind. And the bigger the chances that they won’t fill it out. So, we’re not going to use this field. Click on it and press ‘Delete’. Okay, we’re going to use this single line text. When I enter it, I click on it, and then I can change the field labels, so let’s make this “Name”. The description is pretty easy. “Fill in your name right here . As you can see it, it appears below the field, we’re going to change that later on at appearance. You can change here the input mask, if you want a mask like a phone number or anything that will change the way the people can interact with form. I’m going to demonstrate it later on with the phone number. Maximum characters: you can fill it out if you don’t want anyone to fill out the name with 50,000 characters long, but no one will ever do that. Of course, this one is required. And let’s go to Appearance. The placeholder is the text that people will see inside of your fields so: “What is you name?” you can actually fill this in right there but the question: name is very logical so we’re not going to use this right there. The field label is it visible or is it hidden, as you can see it will change right there to be visible or hidden. We’re gonna make it visible. The description you can use it, you can change this for below, or above your input field. I always keep it on the form settings so we can change it in one go, I’ll show you later on. Actually, we’re not going to use a description for this field, because your name is really simple to understand we don’t need to help people filling out this field. Okay. The custom validation message is really nice when you make fields mandatory or required, then you have to fill this out. “I would really like to know your name”. So that when people leave the field empty, this is the message that they will see in red. Custom CSS class- we’re going to leave it empty right now. You can change your field size you could choose to medium, small or large. If you go to ‘Advanced’ you can fill out a admin field label this only for you, and a default value. We’re not going to use it right now. The visibility of the field, hidden administrative or invisible, it will be useful later on, and allow dynamically, we don’t want it right now. Alright, so that’s it. We have the name, let’s add another field because we don’t want to need to only know their name, we also want to know their email address. So we go to the advanced field, and you drag and drop ‘Email’ right there. Alright, I want the email to be next to the name. So what we’re gonna do is we’re going to drag this one and drop it right there. So now we have two columns in our form, pretty useful. All right. I also want to change the label like this, and I want to make it required. Let’s add another field. I also want to know their phone number. Phone numbers are here, of course, you can make this phone number also required but if you don’t absolutely need their phone number, just leave it off. Because this will make sure that a lot of people will not fill out your form because most people don’t really want to give out their phone number straightaway. We’re going to add another field and the last field, we’re going to add is a paragraph text right there. With the paragraph text, of course you can make people: “What is your question?”. And they get add it right there. So as you can see I am still a little bit of whitespace right there. Now, you can fill this up but the less is more -as I told you. So why don’t we just drag this one? We’re gonna drag this one. And why don’t we just create three columns on top and one column below that one with the question. Now press ‘Update’. So if you want to add this form to your website it difference per theme, but I’m using the Divi theme so I’m going to show you how to do that. Just go back to ‘Forms’. As you can see, you see your ID number here. If it’s your first form then this should be number one, but this is my seventh form I’ve created within Gravity Forms on this website. So the ID is number seven. Alright, keep that in mind. So just go to the page where you want to add your Gravity Forms. I’m in Divi right now, so we’re going to add a module, right there. We’re going to add a text module. And we’re going to paste in the shortcode of Gravity Forms. Now, I’ve placed it in the description of this video so you can just copy paste it in. As you can see it says [gravityform id=”x” well in my Gravity Forms we need number seven, and for you, maybe it’s number one. So just add it in there. And now you can go to ‘Design’ and go to ‘Text’ and we’re going to make it black and then we press ‘Save’. As you can see now, the Gravity Form we just created, has been entered into our website. Of course, as you can see the submit button is really ugly we need to change that. And I also have no reCAPTCHA, we’ll be adding that really soon. So we press ‘Save’, and we go back to our Gravity Forms because we are not done yet at all.
So the next important step is to add CAPTCHA. So we press edit again, we go to ‘Advanced fields’ we scroll down, and we’re going to add CAPTCHA right there to the bottom of the page. Now before you can use reCAPTCHA we need to sign up with Google. So, how are you going to do that? We are going to update our form, we go to ‘Settings’ and then we go to reCAPTCHA right there. Now, how do you go to reCAPTCHA? It’s pretty easy, just type in reCAPTCHA and go to reCAPTCHA from google.com, and we’re going to use the ‘V3 Admin Console’ it’s way easier than the other ones so let’s use this one. First you need to give your website a label. So, this is WPressDoc.com The second is, if you want to have a version three or version two on your website. The difference is that V3 verifies with a score so you will be seeing the label. We can remove it, of course, and you can use the V2, which gives you a “I am not a robot” checkbox. Let’s go with the latest version, V3. First you’re going to add your domain, my domain is wpressdoc.com. I am the owner, and I accept the reCAPTCHA Terms of Service. I want alerts and I press Submit. Just copy your Site Key, place your Site Key in Gravity Forms, go back, copy your secret key. Go back and place your secret key right there. And do we want a check box or do we want to have invisible? Well we have chosen for v3 so we should use the invisible seal. So press Save Settings. And our setting has been updated. If we go back to our form, edit this one. Now you will see on the low side, that there is a CAPTCHA “protected by reCAPTCHA” right. If you click on it you can change a few things. For example the theme light or dark, the batch position on your right or left on your website or inline, well just leave it on the right side – we’re going to remove it in just a second. So the only thing you want to do is you want to make the field label hidden so press update. So if we want to remove this badge from our website to appear. You just go to your Divi Theme Options, or wherever you can add some CSS to your website theme. And you just add this CSS snippet into your website “.grecaptcha-badge { opacity:0; }” it means that the google recaptcha badge is not totally hidden because that doesn’t work, but the Opacity is zero. So that means it is entirely transparent. Alright we press Save Changes. As you can see now on my website there is no batch whatsoever in this entire website. Pretty cool. It’s in description of this video so you can just use it for your convenience.
So let’s dive in a bit in the settings of your Gravity Forms. So when you hover over your Gravity Forms you will see these options you have to edit where we can change the form where we have just been there. You can change the settings. That’s our next step. You can see the entries, and what people have sent into your form. You can preview it you can duplicate it or you can trash it, of course, so let’s go to settings, and let’s go to the forum, settings, right there. So this is the title and description, of course, here’s your layout, if you want to label to place on top, description below. You could turn this on, but the Validation Summary is on the top of your forum where people want to submit it and they didn’t enter all the required fields, then they get a summary I don’t like the summary I’d like to have it in the fields where they are missing something out the required field indicator, if you want to have the text required, or if you want to have a asterik, or you can even make it custom, so you can enter a custom text like me. And this is what happens when you change the text in a custom text, but I don’t like this What I really like is the asterik. Right. you can even change given a CSS class name so that you can change the color for example on this specific asterik on this gravity form it’s pretty awesome. The Form button. The button is the submit button, do you want to have a text or do you want to use a image. Or we could actually also use our own CSS style we’ll be showing showing that later on. So you can make an image or you can use text you want to use an image, then you have to base any image URL. This is something they can improve, because why don’t we just can open it in media library, like this. So if you want to use it, you need to go into your media library and here you can change a button let’s see like see this one and you press this button copy URL to clipboard, you go back to your drifty forms and here you can paste your entire button in. Now the submit button is a image. So you can change it to where you want it, but I’m going to show you later on how to create and transform this into a real defeat button. So, and if we want to. And if we want to change it to a real defeat button we need to use text. Enable Save and Continue this is very useful. If you have a big form restrictions, is very useful. Do you want to limit the number of entries, do you want to schedule it, do you want to require us to be locked in all these things can be changed, right here, very useful, the anti spam honeypot is very useful. This will create a invisible field that only bots will fill out, and if it has been fill out, then Gravity Forms automatically detects that, hey, this was a bot so this entry will be deleted. Then let you see markup, you don’t need this you only need this, if you’re if you’re chasing to the next version of Gravity Forms like 2.4 to 2.5, and your markup is going all sideways and rogue, then you have to enable this one and we’ll be fine. All right, press Save Settings and then we go to the confirmations, I think it’s the most important part of your Gravity Forms next form of course, because here you have to change what will have when someone presses Submit button. I don’t want to have a default confirmation. Thanks for contacting us. No, I want to have a thank you page, because a thank you page is way better. It allows you to track more information with Google Analytics, and it also gives the visitor, a feeling, yes, we got it, and you can also offer something else slightly different product, or whatever you want. You can also use to best field that field query string. This is useful if you want to say hey thank you mr john, we will be contacting you very soon. It is all possible with Gravity Forms so I like this, press safe confirmation, and we go to notifications. This is a powerful feature of Gravity Forms. I really like the way they styled, this one. As you can see, there’s the admin notification press edits and we got to change the admin notification to notification for me. And we want to send the email to your email so this could be anything but my email is the at W WPress doctor Duff Comm. Let’s use a from name, so you want to see if you, if you receive those emails you want to see immediately is from your website. So the from name should be website. Contact Form. The from email should be the same as your domain name right now. So, this would be w press.com, you should use your email address from your website. If I use something else like Gmail or Gmail. Then I will get a warning which is using a third party email might prevent your notification being delivered. So, read, please change this to the URL of your website right now that’s necessary or else a notification will not be sent out reply to you can leave it the same, a blind carbon copy you can also send it to something else like for example sales at WPS doctors Comm. And the subject should be something, a new submission from, and then the form Dido will just give us something that you would like. New submission from, and let’s use the name. So now you can see immediately in your email box that you get a new submission, and you can see exactly the name who sent it isn’t that nice. Yes, yes. Then you have the message well this message is pretty easy just all fields. That’s okay let’s make it a little bit friendlier. Hey, w WPress doctor salon just fill out your form. Go get them tiger, and you can see all fields so yes, you can also add some media. If you want to use for example, logo. Pretty nice but this is just for you, so you don’t have to style it. Just do whatever you want this is only your message you will be receiving. We press update notification. All right, we go back to notification because now we have one notification that is for you, but we also want a notification for your visitors. Why, well, it’s just nice, it’s a great way to say hey thank you very much. We have received your email, blah blah blah. So press Add New. We’re going to give it a name, and we’re going to call it notification for this is are we going to send it to a field because they have just sent, they have just filled out their email. So now you can use it to send an automated email that’s just awesome from them. This is the place where you use your business name for example, for my website, this will be w WPress, doctor. So it could be anything like help this w WPress. Doctor, for example, and your business name right there that could be nice, from which email will be sent Well, it will be sent from the, from the normal email so info at W WPress doctor.com reply to, well they can reply to info to us okay one carbon copy No, a subject is. Thank you for your message. Now we’re going to create a cool deck so first we’re going to say, Hi, and we’re going to add their name. Hi my name. Thank you very much for contacting us. We will respond to your message in 24 hours. Have a awesome day. And of course we’re going to add a little logo to it that will be right. That’s pretty cool. Have a awesome day. Greetings from the Wu WPress, doctor. Alright, that’s pretty nice. Okay, so we press update notification. And now if you go to notification we have two noses against you. One for you and one for your visitor who just submitted the contact form. This is awesome. You can now even add more notifications for your grandma your, and even for your cats if you want them to receive an email. It’s all possible right there. The possibilities are endless. So this is great if you want to pass a notification just press here on the active. And now it is inactive, so it’s pretty cool. Pretty easy pretty straightforward. Well done, you have just created the most useful for websites, a simple contact form. Isn’t it awesome you have now learned the basics of gravity form so are you ready for the next level, because now we are, we are going to play with conditional logic is going to be fun. So, let’s go. And we’re just going to use this one and press duplicate. So we have a starting point. Let’s go to settings, and Form Settings, and let’s change this name to form form form description is whatever you want. A lot of fun with this conditional logic form. Right, let’s save it and head over to edits, right there. Alright so this is the basic input that we have just given. We’re going to change this a little bit around. So we’re going to drag this phone number to over there, and this is going to be two columns. And the phone number, let’s make this field, two columns, and let’s add a number field, right there. Let’s just drop it, when you see this bar, and then you can click on it and let’s change the field label. What is your age. Question mark, and is required. The number format will be like this one so the age is I want to have a range between 18 and 19 because I don’t want people to enter 9000 foot, age, we don’t want this. Let’s add another field we’re gonna create a drop down right there let’s put it in there, click on it, and field label will be this time. What do you prefer as trainer, question mark. first choice, a man or a female a male or a female. And there’s no other choice. So let’s add one more field before we start having some fun, and we’re going to edit right there, and the choice is, how would you describe your physical well being. Well I eat five donuts for breakfast and lunch and dinner. The second choice is. I do a lot of sports. Ease eSports I play Apex legends, every single day. And third choices, man. Any third choices. I’m already a certified body builder professional body guard. Alright so this is awesome. Now we have some more information we can work with. All right, I’m gonna switch these two fields because it’s more logical in the process. So, I just drag and drop this right there and now they are switched. Awesome. So let’s start with conditional logic just press on the field you want to use, and press this button right there, inactive and. Do you want to have a personal trainer. Yes. No, I am not sure. And this one is also required. All right, now I want this field to only be shown when someone fills out their fiscal, well be we going to add another field, we’re going to add some personal trainers, which one is suited for them, according to their own fiscal well being and their motivation. Because, asking for a personal trainer is actually a question, how motivated, are you, huh. Good one. So let’s press on this field, go down there and go to conditional logic, and we want to show if all of the following matches. How would you describe your physical well being is eat five donuts for breakfast or. How would you describe your well being is I do a lot of Esports, I play Apex legends. And how would you like it is. I’m already certified bodybuilder. All right, we press this button and we press update again. Now you’re seeing a preview what will happen right now. First you have to enter your age, so I’m at 25. Then how would you describe your physical well being I eat five donuts, a lot of sports. So, what happens right now when I press this one, nothing appears when I also press this one, nothing appears. And when I enter this one, the field will appear, why is that well let me show you what happens, I have selected with conditional logic, I have created show if this field of all of the following matches. So all of these rules have to match it and then the conditional logic will work. So, when I change this to any of the following matches. Watch what happens, I update this one. Preview mode. 33. Here you go. Whatever you choose right now the next one. So, but now we’re gonna make it more interesting because this is very easy but different different trainers to their preferences. Right. We’re gonna ask one more questions and we’re going to use radio buttons for this, because we don’t have radio buttons right now. So, the radio button is. What are you. Well the first choices like soccer. I want to lose 25 pounds. And the third choices. I just want to work with the six back. So now we have enough information to create our personal trainers through them. So, for that we’re going to use some HTML, I’m going to just drag and drop it right there. I’m going to click on it and field label is. And then we’re going to add some conditional logic so the conditional logic is inactive we’re going to enable it. We’re going to show this field, if my goals, is I want to look at the WordPress, doctor. And we’re going to close this one updated, then we need to change the conditional logic of what are your goals. So, enable conditional logic, we’re going to enable conditional logic, and we’re going to fill this out, do you want to have a personal trainer is. Yes. and also is no trainer is, I am sure. Right now you will see something happening this field, always shows. Because, as I fill this out, you will notice that this field has already been selected. So, we should change this to a placeholder, which says nothing. So, we go back. We go to do your watercraft personal trainer we are we going to go to parents, we’re going to add a placeholder. Yes. I am not sure. No, when I save this one right now, you will see what happens in the preview, you will see that the conditional logic field is gone so keep that in mind if you don’t want to show your fields in a drop down, only F to someone have chosen this is the way because now when I fill it out. It’s $5 for breakfast, lunch and dinner. You see, yes, no, I’m not sure it’s an option, or you can type in anything you want in the placeholder. So, this is the way this works with conditional logic. When somebody say yes. Are you goals. No, I’m not sure. It doesn’t really matter. However, we’re going to select personal trainers, according to their options if they do want it, and their goals are like soccer. Just want to lose, or I want to look at the WordPress doctor Well, this train will help you reach your goals is Arnold, and he’s a very nice personal trainer. So this is for someone who wants to have a personal trainer. As you can see, Arnold has the conditional logic to show if what are you goals, is just one little bit of workers doctor, and you want to have a personal trainer is yes, and then Arnold will show up because he is the right trainer for motivated guy to want to look like me. All right, Russ update. So we’re going to add another one, and this is the URL rock. And the rock is here to help you know motivated people so we’re going to activate conditional logic. Do you want to have a personal trainer is no. And what are your goals, his goals like soccer. And we’re going to update this one we’re gonna preview it. So let’s check this out. Yes. Oh, I mean, no goes like soccer, and then the rock will motivate you. Yeah, that’s pretty awesome. And when you choose another one. It doesn’t work like that. Pretty cool. So I think you get the idea right now let’s add just another one for fun. So we’re going to duplicate this one, and we’re going to add the human need workout and conditional logic is, do you want to have is, I am not sure, and what are your goals, his goals like soccer, and we press, update, and we go to the preview. And of course, whenever you want it. I am not sure I have no goals. This trainer will help you and Laura will make jokes and you realize, you’ll need to work out. Now you know how to create conditional logic it isn’t that hard, isn’t it, it is actually pretty easy. So, but now you have two examples to how this work and you can create your own awesome conditional logic fields. All right, let’s go to the next level. Well, we will make a crazy form with all the fields that Gravity Forms have to offer us, are you ready, let’s go. So for our crazy form we’re going to duplicate our fonts form, and we’re going to introduce settings Form Settings, and we’re going to change this to the crazy form a lot of fun with all fields of revenue or right let’s save this one. And let’s head over to edit. Alright, so we have a lot of questions right now but I’m not very fond of it because it’s too much. So we are going to make different pages. So you go into your standard fields, and you drag and drop this page, all the way to the top. And we have start Beijing page break, and here is ends Beijing. Alright so what do I want to do well. I want to move this section to this page, we’re just going to move them right there to the page. Just like this. It’s pretty easy. But now we also want to have the phone format in the US, and it is also required, but now we also want to have people fill out their address so we go to Advanced fields, and here they can use their address right there. As you can see the field labels, the field can be entirely customized. If you want to have to street address every slide to well we don’t use it in my country so let’s keep it, state, zip postal code let’s change this to postal code, and the country is of course it’s a drop down very useful and default country will be the United States of America. And you can of course change these fields. Also, so for example if you want to change this to, like your neighborhood, if you’re a very local business you want to know the name of what part of the city there, and you can change this to for example your neighborhood. Let’s click on start beating and now you can see these settings after page break. Do you want a progress bar, a steps or not let me show you how it looks like. We now have a progress bar which is filled out in percentages. You can also change this two steps, you have one and two, which you can actually give a name to it. So, the name would be for example, personal data and gym preferences. So if you now look at the preview, you will see that you have different steps personal data and gym preferences, as you can see this is pretty cool. And now also, I really like this bar because now you also see the steps in with your bar so we’re at step number one personal data, and it’s like 50% of form so that’s pretty cool let’s keep it this way you can also change it if you want to make it like orange, and now you have a orange bar. Pretty cool pretty cool. All right, so let’s go a little bit down there are your speech breaking and this means a new page will start right there. The next button you can even change the text of or create an image, and we’ll be styling that later. You also have beach conditional logic so when you activate this one. The next page will only show is if for example, what are you goals are well, it’s just a conditional logic if we just talked about so you can create anything you want with this page.
Okay, you can also use only the Next button conditional logic is very useful if you want people to fill in and go to the next one. So let’s create something more of our form. Let’s go below here. And when people have picked their trainer, and it filled this out, and we gave him this device, it’s time to give some information. So we go to a farmers field, and if people can, that people can pick a date, because all what date they want to start. What do trainer date input job could be a date picker, a date field orientate dropdown, let me show you the difference right there. This is a date field. This is useful when when entering your date of birth. So we can calculate your age, a date picker is when you click on it, a calendar will appear. So let’s use a calendar icon just to be sure any date drop down is well, just like that, you can drop your data, let’s go with the date picker. And let’s choose a calendar icon. The date format is very useful if you have if you are in another country, then the US then for example, we have date, months, years, Monday, yours, you can choose whatever you want. And of course, this one is also required. Alright, this is all good. So after the date bigger, I also want to have a time picker just on the right side of the date picker. And this says Do you have a preferred time, the time field is actually the same as the debugger. But now you can add your chime in it’s logical you can choose for 12 hours or 24 hours. I always like to use 24 hours, but it’s solely up to the culture of the country you’re into and your target audience is at. And of course, we got to make it required. Let’s go to the next advanced field because what do we want more, so let them fill out their website. Also, what is your Facebook URL, and it’s not required because some people don’t have Facebook already left it or whatever. And let’s make it the placeholder is HTTPS facebook.com. Slash. So people know what actually to fill in this form. And let’s make it visible description. Sure custom foundation message. So every Facebook URL, I want a new page to start. So I go to the standard fields. And I drag and drop page and I drop it there. And then I go again to my offense fields. And then I go to list and I just drop it in the new page. So that is the third page. So let’s change this field label to what what exercises you been doing. But it might be a little bit hard for people to think of what their exercise they were doing. So we’re going to edit the description, three, enable columns, then we will have three columns, which is awesome. So now you can change this one, size three, and they could even if they want, and then we go to maximum roles. But let’s make two because I don’t want them filling out everything. And let’s do the description above the input. Alright, so the food will look like this. So here you can enter exercises, and then I put the person’s last button, you will get even more rows. And they will, they will be enabled to have more. As you can see the exercise is numbered one, two and three. Well, you could remove it when you use it like this, there are more ways of adding this. So let’s add another field is called the multi select. So for example, if you press this button book at preferred choices, this will really help you out a lot. So for example, all countries in the world Whoa, that’s a big list. You don’t have to type it in manually or the states or the Canadian states or the continents or the genders or the ages or any marital status or employment jobs and this free education days of the week. There are a lot of things that you can use for this item that is really awesome that that they made this predefined choice and really happy we’re going to create our own field. So what juice? What do you want to drink? The more in the gym. Are you crazy? Just water. Second choices. very unhealthy soda drinks. Only coffee, please. Next one, fresh fruit juices. And of course, the most used juice in the world at every gym, coconut juice, which is true. umbrella. Pretty awesome. All right, so this is the last page. And of course, we also want people to do something more. So I also want people to upload something to the website. So let’s go to File Upload, and we’re going to place it next to the drinks. And when you press this button, you will see filled label, let’s make the label, you upload a picture of your buddy with your underwear on why we need to know how much fat you have these four come through. Of course, this would never happen in real time, because everybody is welcoming everybody. It’s okay. But just for the example. So, so allowed file extension is pretty useful. So let’s enter a few allowed extensions. For example, if you want to have images, I want to accept jpg, jpg, jpg, jpg. png. And also I want to accept from a PDF, ma. But nothing else because I don’t want anything else on my server. If you want the user to upload multiple files, you can click this option. And then they have the possibility to for example, to upload two files to your website or maybe five files, it’s totally up to you. It’s very useful if you want people to upload their ID, their Texas paper or whatever you want on your website. We’re going to enable it right now. And the maximum file size. Most people don’t know how to compress their photos when they upload it. So I’m going to put us on five MB. And I want this to be required. Of course, appearance, let’s make the field label visible description above the input and the custom validation message. Please send us a picture. Okay. It’s It’s that simple. It is pretty easy. So now our form is almost complete. The most important thing is the consent field. Let’s edit right there. Because sent field is something that people need to. So we’re all legally covered by this one. Alright, so field label, your common sense. Oh, totally agree to privacy policy and the conditions below, I can’t stand to receive a lot of spam emails, not entirely restricted, Drew five emails a day. Also, I give permission for my day job being sold on the dark web for the highest that are or even the lowest there. I have absolutely no control over my day job when I press this sub button. And it’s required. Yes, no, that’s a consent. I really love. Alright, of course, you can make it required. And this is all good. So let’s update this form. And this looks actually really good. Now one thing we have forgotten almost, we have to add our capture to this form before anyone gets submitted. And we’re going to remove that field label in the appearance, field label hidden. Alright, we press update. And now our beautiful form has been completed. And this is how it looks just fill it in. It says conditional logic. And with of course the conditional logic forms in it with our personal trainers, especially to help people out we have our date picker, which is really awesome. We have our time picker. So we have the face URL. We have exercises lists, we have these multi select, can you upload a picture of your body, which around the world. So every body works, I totally agree with this. So this form works pretty awesome. And as I have shown you before, you can just enter your form by using this ID number, and editing the shortcode in your website. So when people have filled out this form, I really want people to sign this form also and to receive a PDF, is it possible to graph the forms of course it is. So head over to the Gravity Forms website. And on the Gravity Forms download website, you can actually download all kinds of add ons through your Gravity Forms, well, you need to have a license for this, of course, or else you won’t be able able to download it. I’ll make a lot of videos about all this add on. So you can make a really good decision if you want the elite license or the pro license or whatever I so I want people to add a signature to redraft the forms I need a lead add on. And I go to a signature. And let’s just download it right now. And I’m going to create even more about surfeys is going to be so awesome you direct or user registrations. Man, the possibilities are really endless with Gravity Forms. And I go to my plugins, I’m going to add a new plugin. And I’m just going to install the Gravity Forms signature plugin we have just downloaded, we’re going to activate this plugin. And now when I go back to my forums, and I go to my crazy form, I’m gonna edit its or you can see in the advanced fields that we have a signature form right there. And we are going to add this signature field right there above you for now this is a really great one. Because now we can add field label your signature. And it’s also required. The most beautiful thing about the signature field is that it also works on your tablets and on your phones, it is really well done. So the background color, let’s keep it wide. Let’s have a border wide. You can actually change anything the pen style, let’s make it in black band size, small fields wise fiscal label. Yes, Alright, we’re gonna update it. And now when you actually reload the page, and as you can see there is a little box now where you can place your signature, as you can see is really awesome. You can just draw whatever you want. It’s good w pres jaws dog with a smiley face and a little sunshine on there. So this works really great. When people submit this form. I also wanted to resend it with a PDF to the people to the visitor and also to me so I have a little bit of kind of a contract that has been filled out and signed. So it’s legally bound. Well, for that we need another plugin. So we go to plugins, Add New. And we’re going to search here for Gravity Forms PDF. Now this one is a free plugin, which you can use, we know your Gravity Forms, just press install. Now. We got to press activate, you go back to your forms, you go back to your crazy forms, you go to Settings. And as you can see, with settings now you’re suddenly PDF. Interesting. So this form doesn’t have any PDFs. Let’s create one, right, here we go. And let’s create the name of our PDF crazy form PDF. So they have created different templates for your PDF. If you personalize fonts, you can actually look at them a little bit. And you can add new ones, you can even buy new ones, so it’s very well created. Let’s go with this one. I like this one with all the gray areas. So yes, let’s like this one. And let’s add the PDF to a notification while the notifications for me of course and also notification for visitor. Now the PDF will be attached to the selected notifications. It is awesome. So what are is the filename of the PDF? Well, let’s make it a file name that we can work with in our business. So it will be contract the hash and then the name. Here website form on and then we have the dates of course because we have added IDs and we’re going to add PDF n Voila. That said it’s dead easy and it works really great. And you can even style more you go to Appearance, you can change paper size, orientation, phone logos, templates, of course, is really awesome headers footers is great. And I really love it. I really like these guys for making this free, available for everyone. And so this basically, it works awesome now. So one thing I do want to point out when you’re at your forums, you can always go to entries. And here you can see all the entries of your form. I think it’s very awesome that the forms are being saved in your database. So when you have deleted your email, no worries, it is always here in Gravity Forms is safe, and it’s always there. Also, a very nice feature is when you want to export the entire entries to, for example, Excel or CSV, just press this Import Export button, you can export entries, and you select just your form. Then you select all the fields you want to export. And you select your date range, and you can download the export file. This is pure gold, especially when you’re working in business. And you have a lot of customers filling out your forms. This is pure gold, it really helps. You can also export your entire forms or your import forms. So for whatever reason, when you want to export your form shoot on a website. Well, this is a very useful way to switch in forms to really quickly save your own forms and reload them in different websites or whatever. It really works. Awesome. And I promise you guys to tell you how to style this gravity form within, for example defeat. But I’m going to show you a method that you can use on all different websites with all different themes and builders. So the first thing we want to do is we want to change that ugly Submit button in something else. So what do you do, you press on the right mouse button and you press Inspect Elements. Now you see all the gos CSS markup of your button. Right now we have the G form Submit button number seven as you can see it so you can actually style it. For graffiti form that is pretty awesome. You click on the right button and you go copy and you say CSS selector, right. Now we go to close this one. And then we go enable visual builder. And then we go down, we press this button right there we go to the options, then you go to a font, you go to custom CSS, and we’re going to paste in the thing we have just copied. So this is actually the selector of the drafty forms button. There it is. So if you want to style it right now, it’s pretty easy. before we’re going to start we need the actual CSS from a Divi button. So we’re going to save this changes, we’re going back later. So go to let’s say I want this button up here to appear down there, just click on it and press Inspect Element again. And as you can see, right now the button has been selected, right. These are what you see right here. edpb button is from Elegant Themes. And the button is right here. This is the entire markup of the button. So we’re going to select this Oh, by the way, including the brackets, and we’re going to press copy. And we go back to our defeat, we go back to our options, we go to fonts, custom CSS, we’re going to leave this one, we press enter, and we’re going to add this CSS that we just copied from the other button. And now when we scroll down, you can actually see the button is actually moving here is happening something is pretty awesome. So let’s go back to the custom CSS. And let’s really see what’s happening. Now. We have padding, we have font size, we have background color. Let’s make it for example recce you can do that right now. And then the color of the text. It’s not here, so we’re going to type it in color is for example, why’d you go now we have a white color on a red button. I, of course radish just you know what I mean? So now we have changed this button on this draft for now you can do this with old Gravity Forms. It’s pretty easy. It’s pretty basic. If you just follow it. Now you’re actually adding some custom CSS to your website. Isn’t that awesome? I’m proud of you for just trying. You can create any button you want with the style and also works in Elementor. It also works in all different teams just created by them first, then inspect what your elements copy the CSS code and just paste it in right there. It’s really simple and I know you can do it the same way I did it. Alright, so guys, that’s basically it. I hope you’ve learned something new which Gravity Forms material. If you have any questions, drop them in the comments and I’ll be glad to help you out because I just like helping people. If you’d like this video, hit that like button so I know we’re on the right track. Feel free to subscribe, because I’m going to create a lot of more videos about Gravity Forms in the pro add ons and the elite add ons is going to be fun, and also a lot of different videos about WordPress related stuff. All right, I wish you a awesome day and I’ll see you in the next video. Well Oh oh oh Evening Hey, this guy? Yeah. Okay those Neda signer Hey you
