WL_Form_Contact_1280x720.mp4

00:00:00

In this tutorial, I'm going to be discussing the form contact widget

00:00:04

The form contact widget is an easy way to create a contact section with details and pre -made forms, which allows users to contact you, such as sending you an email or a message

00:00:15

Now the form contact, many of its functions can also be achieved with buttons or content blocks

00:00:21

However, the form contact is specifically designed just for contact and it also has auto responders built into it, so you can automatically respond to messages that you get, which is a pretty neat feature

00:00:31

So if you ever want anyone to send you a message or to give out your email, then you would want to use a form contact

00:00:38

So once you create a form contact, it's going to ask you to fill out the forms

00:00:42

So simply create the contact

00:00:44

You can see here that the form contact is empty when you first create it

00:00:51

If you want to add a title, you can do so at the top here

00:00:55

And then for the contact data, you would simply click add a new field, and this would let you add a field

00:01:03

The field type is going to be what they're contacting you with

00:01:07

So for example, if you choose email, they're going to contact you with email

00:01:11

And the field value is the value of that particular field

00:01:15

So if you chose email, you would enter an email address here

00:01:18

So for example, here's where you would put your email address

00:01:21

And then they would be able to click that and then send you an email or to whatever email is entered in this field value

00:01:26

And the help slash label for this field is basically the text that's going to appear below that field to let people know what it is

00:01:34

So you can type here, for example, email me to let people know that they should email you

00:01:40

And when you save this, it's going to create that field on the right here

00:01:44

You can see there's our title at the top

00:01:45

And there is our email address

00:01:47

And then the email me, which is that that's that help slash label field right there

00:01:52

So if you were to click on this, it would open up your email application, either on your computer or your phone

00:01:57

And then people would then be able to send an email address to that particular email

00:02:00

You can also do like phone numbers, for example

00:02:03

So if you enter a field value of phone, here's where you would put the actual phone number of that value

00:02:09

And then you can enter some help text

00:02:13

And once you save them, you can see it's going to automatically create each field, you know, in a row, right on top of each other automatically and it organizes them very easy to use

00:02:23

You have multiple different, you know, fields you can do SMS, which is the text messaging

00:02:28

So you'd enter phone number here as well

00:02:30

WhatsApp is your free, it's a free messaging platform

00:02:34

So you would enter the WhatsApp phone number for the field value and then you can type of WhatsApp me here or something

00:02:39

And for the link, this would be like an external link

00:02:42

So you can link to a different website

00:02:45

And that's a very easy way to put in a link

00:02:48

And there's also address field as well where you put in an address and then you can show someone an address

00:02:54

You can see here on the right, it automatically created all the fields for me

00:03:01

And this contact form, this switch controls this contact form right here with all of these boxes

00:03:08

This allows users to send messages

00:03:11

So if you don't want people to send you a message using this and you want them to use just like your email or text message you, you can switch this off

00:03:18

When you switch that off, it's going to hide that contact form

00:03:21

You can see that contact form is now gone

00:03:23

So it'll be just these people would be able to just click on these and that would open up in their phone app or however, however, and then they would be able to call you or email

00:03:31

you

00:03:32

But if you want them to send you a message from the website directly, you can enable the contact form and then people then be able to enter their information, a message, and then it would go

00:03:44

to whatever email you set here in the send form data too

00:03:48

You would have to put like your email address and then that's where that message would go or you can post it to a form as well

00:03:56

If you know a URL of a form, it'll post that automatically

00:03:59

And then once this is enabled, the contact form, the auto responder will be enabled as well

00:04:05

If the contact form is not enabled, the auto responder will actually be hidden, but you would simply turn the auto responder on if you want to enable that

00:04:14

And what this does is this is going to automatically respond to anybody that types their email address and their message here

00:04:22

So if someone were to type their email address and message, it would respond with all of this information

00:04:28

So the from address would basically be where the email looks like it's coming from

00:04:35

And the auto response subject is going to be the main subject for that email

00:04:39

Just like every email has a main subject and a from address

00:04:43

You can also do a from name

00:04:45

So if you put your actual name here, it'll it'll appear as the email address and then your name right next to it

00:04:50

And then the body of the auto response

00:04:53

So you can put here, you know, like thank you for messaging me

00:04:55

I will get back to you as soon as possible or something like that

00:04:59

Once that's all set, people would be able to fill out this information, click send form, and then whatever email address they put here, they would then get a message from this auto responder

00:05:09

So that's an easy way to engage with, you know, people messaging you, let them know that their their voice has been heard or that they're going to be responded back to

00:05:17

And it's a very powerful tool as well

00:05:20

Now as for additional options or just like all the other widgets, you can determine whether this is mobile only or desktop only or if it has to be logged in, it's often useful for the form

00:05:29

contact to make one mobile only in one desktop only

00:05:32

You can for example, you know, put the your phone number on the mobile only and take that off of the desktop

00:05:38

So it takes up less space because nobody ever really calls from a desktop

00:05:42

So you can use these very powerful and very easy, you know, to determine what is and isn't shown on mobile versus desktop

00:05:48

And for the additional styles or just like all the other widgets, you can determine the space that it takes up on the desktop as well as some of the margins and the custom class if you

00:05:56

know CSS, as well as the background, you can do a nice background

00:06:00

You can do solid colors, images, even videos

00:06:03

So if you wanted to do a nice very basic gray background or something for this whole contact form, you can create a background, save it, and then it'll fill in this whole form with that background

00:06:12

So it's very easy to use, very simple

00:06:15

And if you ever want anybody to contact you, then the form contact widget is definitely the widget that you're going to want to use