Creating A Contact Form Using Contact Form 7 in WordPress

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
hey guys how's it going in this video today we're going to talk about how to create a contact form for your wordpress website so without further ado let's jump straight into it so looking at my screen here we've got a brand new fresh clean blank wordpress installation so having a contact form on your website is pretty much kind of a standard thing you have to have on every website it's good practice to have some way to allow people to contact you directly oftentimes yeah you can leave a phone number and things like that but i think people find it preferable to have a form that they can type in their information hit send and then wordpress will actually send the email for you so if you've got a a website that you want to add a contact form to it's actually pretty pretty simple so make sure that we're logged into the the wordpress backend you can see that because i've got this black bar at the top and we're going to click on the dashboard then we're going to come down here to plugins and add new and we're also going to type in contact form over here on the right side now contact form 7 is kind of the standard that's what everyone uses if you look down here you can see there's over 5 million installations worldwide that's pretty insane like this is a tried true good solid plug-in now the one thing i've never understood though is why it's contact form 7 not just contact form because as far as i know there's no contact form six or five or four or anything before that it's always been contact form seven so if you know the answer that let me know um but keep going with this we're going to click on install now and then we're going to do is we're going to click on activate so over on the left side we're going to go to contact and we're going to go to contact forms now i'm just going to use the default because they automatically create a default one for us and we can just use the standard default one and tweak it to our liking and then if you don't like it you can add additional ones or delete it entirely so the very first thing we're going to want to do is you see here under this column that says shortcode there's this this command what we're going to do is we're going to actually highlight this right click and go copy and this is going to be the code that we place somewhere on our website that will actually show the physical contact form so i'm going to actually create a contact page and how we do that is we come over here to pages we're going to go add new i'm going to close this and i'm going to say here contact us now remember we've got that piece of code that we pasted it where we copied before we're now going to paste it in here and wordpress gives us this little hint that says hey this is a short code i recognize this if i come here and say publish and publish the page and i view the page bam we've got a contact form all ready to go now we're not quite done yet though because we have to configure the contact form to give a certain feedback to tell us where we want to send the email all that kind of stuff so let's come back here and go back to our dashboard we're going to go to contact and we're going to go to contact forms okay so if we scroll down here this is the template this is the layout for how our contact form is going to look you can modify this to determine what information you include or don't include in your form let's say for example that i don't need a subject in my email what i can do is i can just take this section and go delete and i'm going to save now if i come back here to my pages go to all pages find my contact us form and go view then you'll notice that we no longer have a subject line anymore let's uh let's go back and add like let's say we want to add a phone number so that we can contact people call them back after they've submitted a form so we can do is we can come back here go to dashboard again go back to contact and contact forms and then we'll click here on our contact again and then down here let's enter uh let's enter a new label so that we can say phone number so we'll come here and we'll say label and once we open our label we need to close the label and here we're just going to follow the same format as below as above and say your phone number okay now that we've added the label we can come up here and you can see there's all these pre-programmed pre-defined options that we can choose from so let's say we want to add a telephone number i'm just going to click right here on tell you'll get this little pop-up you could modify settings here if you want you don't really need to go ahead and just click insert tag and then go ahead and save the contact form if we come over here to the contact us page and then refresh you'll notice we now have a section that says phone number and we can put in our phone number there and allow us to send that information to whoever's receiving this form okay moving along going on to the mail section this is what defines where our form information is sent so most of the time in like the in the to field for example we'll want to say your email at gmail.com the from section is is going to say what is what is the email going to be displayed as when uh when we receive the email form so we'll go ahead and bryce demo is just fine but if you want to say like my contact form you can change that however you'd like i'm just going to leave it as bryce demo which is fine the subject 2 is going to be bryce demo the cool thing though is right here in brackets where it says your subject if we still had a subject field on this form they're actually going to insert that value for us they're going to take whatever the user typed in the subject field and they're automatically going to put it in the subject line so that when we get the email we can see the subject of the email without actually opening the email obviously because we don't have a subject anymore though what we can do is we can just change this and i'm going to call this tel 949 now you see i get this value up here this is because these are the fields that we automatically included from the first tab so this is the name of that telephone field which we just added so if i put this in down here we can get the user's phone number right there in the subject line and then if we keep scrolling down more this will be the message body this is how the email is going to actually look let's say for example we don't want subject you know we can delete this if we want to add certain things we can say um right above the message body we can say this message was sent using the contact form on your website and so now every single email that we receive is going to have that information in the body of the email which i'll show you in just a second the last thing i'm going to show you is the messages tab and this is just the messages that are shown to the user after they submit your form so for example after a user submits the form and the email is sent successfully you'll get this error message or excuse me this success message that says thank you for your message it's been sent if you want we can change this and say thank you will be in contact shortly great if we come down here we can say save now you can see all the different messages that you can customize you can say oh this field is required this field is too long this is too short date is incorrect you can customize all these so if you don't want the pre-programmed values then you can change those but i found for the most part that they're pretty good i wouldn't change them except for maybe the success message now if we come back here to our page if i refresh i'm going to say bryce test we'll say test at test.com and we'll say seven eight nine 123.456.7890 and message this is just a test message okay and then i'm gonna click on send and if you notice thank you we'll be in contact shortly so that's the message that we modified earlier now if everything is correct we should actually get an email from this contact form to whatever email address we have to find here under the mail section so if we come in here to my email you can see here bryce demo one two three four five six seven eight nine zero if i click on this we can see this message was sent using contact form and the body text is this is just a text message so everything is good and it's working now one thing i do want to say though is oftentimes uh when you're using the contact form the emails that it sends get automatically sent to the spam folder they're not going to show up in your inbox now if you want to resolve that go ahead and check out this video i'm going to link above here that talks about how to make sure that your emails get sent without getting sent to spam so check out that video otherwise i'll catch you in the next one thanks for watching
Info
Channel: Bryce Matheson
Views: 60,033
Rating: undefined out of 5
Keywords: creating a contact form using contact form 7, contact form 7 plugin, contact form 7 wordpress tutorial 2015, contact form 7 tutorial, wordpress contact form 7, how to use contact form 7 in wordpress, contact form 7 wordpress, contact form 7, create contact forms in wordpress, contact form plugin wordpress, contact form 7 wordpress tutorial, contact form wordpress, contact form 7 customization, contact form in wordpress, wordpress contact form, contact form 7 not working
Id: 4AN8dGVvR6w
Channel Id: undefined
Length: 8min 52sec (532 seconds)
Published: Tue Oct 06 2020
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.