Video Summary

In the last section we went over the design of our contact form section for this landing page. And in this section we are going to customize and develop our our contact form to make it more customized to our business, because the steam that we originally had was for an insurance company, and that’s what this form is actually showing. It’s got home vehicle and business. So those are really like the top three main earn sir services that insurance company offers. And also to is that it has select your type of insurance and it has a little slider. We can’t doesn’t really work while we’re in Elementor. 

But we have the limits of bounds. So that is kind of your coverage limit that you would be able to save from this contact form. Now if we were in if we were a auto dealership right where we’re selling new or used cars, having the slider here might really benefit us because knowing someone’s say, the maximum out or their ideal spending limit will help us pick which cars to actually show them. But with this website, we’re more of a mechanic auto body shop, right? We’re helping fix and repair people’s vehicles and get them back to like new type bodies. So this insurance or this insurance form is going to work for us. So we’re going to want to change that. Well while we’re in here. Let’s just let’s click on this contact form and let’s look at what the Elementor elements allows us to do. So let’s look at home. So as I’m looking at this, all we see is the title and we see the icon and we get to pick which insurance form or which contact form we want to use. 

And for each one of these I believe they have the insurance form. So it’s not allowing us to edit the contact form through here. So what I always do is when I’m trying to figure out what contact form this theme used, I always go back to the theme documentation. And I look for something that says Contact Form and for this, we are seeing that the element contact form number seven tabs and that’s what’s showing us up here is that the contact form where we’re basically this is what we’re seeing over here. And then if we scroll down, we see that contact form seven is highlighted or I highlighted that for us. So for new WordPress developers Contact Form seven is probably one of the most widely used contact forms through WordPress and especially WordPress theme developers. And one of the main reasons why they use contact form seven more times than not is because it’s free. There’s no licensing fees. Anyone can use this form and if you kind of look down here, you see that you see a lot of code but that allows the developer a lot more range and how they want to style this form. 

Now, with that being said that there is some code sometimes that goes with this and it can be a little bit more complicated for new developers, right, especially ones who don’t really know code, right? And with this course, we want to just know enough code to be dangerous with WordPress. We don’t necessarily need to build these things out from scratch. So in later lessons, we’re going to when we’re going over plugins, we’re gonna go over multiple different kinds of contact form builders that make it super easy to not only style it the way you need to but just have a nice functioning quick, you can create these forms really quick. But for this lesson, and more times than not you might have a few if you look at this contact form back over here. The notes styled really nice, it has these nice cool little tabs if we want them. 

We have a lot of things going on for us. So sometimes it’s better to just edit and change what’s already here. And then it is to say create a whole nother form and try to style it. So with that being said, let’s hop into developing out this contact form and just finding where this is at right. So if we go to the dashboard, when you’re doing contact form seven, it’s just contact and it’s got this little icon and it’s usually right above the WooCommerce rate below comments, depending on how many other plugins you have. And we’ll get that in later down in this course, but usually it’s kind of the placements usually right around here. And if we just go over here to contact forms, we get to see all of our different contact forms that we have. But we know from here that we have the insurance form but before we start playing around and actually trying to work with one form or another let’s see what the other forms are like. So let’s just check out contact form one. 

This one’s nice. I’d like to name email, phone number subject write a message but the styling we could we could potentially edit that with CSS, but I think probably I really just like the way that this one was set up, right. So what we’re going to do is we’re going to come back here and let’s just edit this, but actually before we edit this, we should always try to duplicate it because if we duplicate it we are working with this essentially the same form. But at least we have the original go off of in case anything goes wrong or we mess up or we accidentally delete it or don’t save something on at least we’ll be able to always restore or be able to restore or go back to the original form. So let’s click Duplicate. 

And now we have the insurance form copied. And since it’s got this nice copy here, I think we can leave that for now. Because eventually we might want to re change this obviously we might put in mechanic but this is this is a title that no one would really see. So we’ll be okay there. But now we get this we get this large. 

What do you call it? We get this big coding or string of code right? So what what I want to do is I want to stop this video here to break this up because we’re gonna do a bunch of really deep dive into how we can customize this and really organize what’s happening because sometimes you will run into these very lengthy contact forms and we got to figure out how we can be able to make sure that we’re able to transform and customize where it has been given to us right, so let’s pause this video, go the next lesson where we’re going to deep dive into how we can dissect this contact form.