Welcome back to the channel. In today's video
I’m going to show you how you can get your data that you collect on a contact form 7, send it
to an API or even use it to mail it elsewhere. So what we're going to do is we're going to use
a function that's embedded in contact form 7, and then we'll use some objects that are available
in the plugin itself. So let's write our own custom plugin. In my plugins I’m going to create
a new folder and I’ll call it “contact form 7 api sender”, and then I’ll copy this, drag and
drop it in my editor, I’ll add a file with a php extension, of course I’ll start with the php
here and I’ll use my start plugin snippet to make this possible. So I’m going to contact form 7 API
sender. I’ll change the URIs and then I’ll leave everything else as it is. So I’m going to go into
my plugin section and I’ll activate the sender, and then I’ll begin coding what we have here.
So inside here we're going to start with an action hook that comes contact form 7, so I’ll
write a function here and call it “techiepress contact form 7 api sender”, and this is the
function that I’m going to use with my hook, and the hook that we are looking for is actually
called wpc; for WordPress contact form 7 mail sent, and that's what we are looking for.
Now this hook gives us an object which we can use and that's basically the contact form that
we have. Now with this object we're able to get the title from it, so we'll get the title, and
what we're going to do is save this as a variable, we'll call it title is equal to the contact
form title. Now why we need to save the title is because we might have so many contact
forms on our particular website and we might just want to use this one. So we can
see here the title is called web response, so I’ll copy this, come here, and I’m going
to do an if statement and say if the title is equal to, I’ll add a string web response,
then we are going to do a couple of things with this particular form. Now if we
want to work with the submitted data, we're going to have to use the “WordPress contact
form 7 _ submission object”, which is basically a class that is from contact form 7. Now with
this particular class it has a particular method inside it. If you do not understand the
terminology I’m using, it's because the plugin uses object oriented programming; where you have a class and a class has inside it a function, and the function in OOP or object oriented
programming is what we call a method. So this class has that static method which is called
“get instance”. So the first thing we do is we run this submission class, and we're going to store it
inside a variable, so we'll call this submission is equal to the submission class and we're
going to get an instance of that. So next we are going to say if the submission is true, then
we shall have something running. So submission; if the submission is true what we're going
to do is we're going to get the posted data, and we're going to say the posted
data is equal to the submission, which is a reference to us getting an instance
of the submission class, and we're going to get a method from there which is “get posted data”. So
we're going to get the posted data and we're going to save it inside this variable. So after getting
our posted data saved up, we are now going to start getting the different fields that are inside
our forms. I’ll go back to my page right here, copy the code that is here, and I’m going to
come and just paste it here and comment it out. The reason I copy it is because I want to get
these particular ids of our fields. So I’ll copy this and say if I want to get the name; variable
name, it's going to equal to the posted data, and then of course the posted data is going to
come as an array of data. So if I want to pick off the name, I’ll have to use this id of “your-name”.
Now depending on how your ids look like, you might need to change this or you might
need to get the ones that are available for you. So what I’m going to do is just duplicate
this over and then get all the other pieces. So I’m going to get the email, I’ll get the subject
and then change it to “your-subject” here, and I’ll get the message which I also call “your-
message” right here, I’ll take away those comments and that means we have all this content that
we actually wanted to have here. Now what I’m going to do is I’m going to var_dump all this
information, and then I’m going to choose die or wp die so that I can see what happens. So let
me get the name, dump it, let me get the email, then the message. So copy this and paste
this, save. Now let's go to the front end and try to send a message. So I’m going to
copy this code, so I’ll put a shortcode and I’ll call this contact form 7, and then I’ll
publish this page, and I’ll go to view the page. Now when we reach here I’m going to add in my
names, so Techiepress, I’ll add in my email, I’ll add a subject, and then I’ll put in a
message which I’ll say “message goes here”. So I’m going to hit send and we'll see that
this uses Ajax to send this message. So let me inspect this to see if we are
going to get any particular errors. So when we trigger the send you
will see that we have a post here, all this different information here, we have
a response; message has been sent, and it had a particular payload we've decided to var_dump,
and you can see that we are var_dumping the name, the email, the subject and so on. So what I’m
going to do instead of doing this, I’m going to get this particular information and I’m going
to email it to myself. So instead of var_dumping let me email this. So I’m going to use a
particular function which is wp mail that is default to WordPress, and we're going to say to,
let's just say we're going to send it to that email, the subject is already set, the message is set,
the headers and attachments are what we might not need. So I’m going to just email this to myself,
so let me save this, go back here reload this, and let's try to add that
information. So we'll just add, hit our send, we'll hit send, says message is
sent. Now I’m using local by flywheel so let's check the mail traps that it has done to get
our info. So we'll open up Mailhog and you'll see that we have our subject is here, so it was
trying to send that information, it's saying the message is from techiepress at that email, the
subject is this, the message body goes here, and you can see more of the information
if you're really into that kind of thing, and you'll see everything is as it should be.
So instead of sending an email, you can actually decide to just post this information to a foreign
server. So you would have to use the “wp remote post” function of WordPress. So in here I
would put this comma, I’m going to add a url here and I’ll say this is my url where this data
is going, and then I can add arguments, or args that will be used to send this data. So in
here in the args I could maybe add a header, I could let's say if I needed to authenticate
what I’m sending so I can add it in the headers, I can add a body with all the
text, so let me add a body, I’ll wrap this in here, and then our
body is going to have an array of data, so we can have the name, subject and email,
copy these, I’m going to put them here, I’ll put these quotations, add the arrow signs,
at the end put the commas that are needed, go back to the beginning, paste this in here,
go back to the beginning and clean this out. So this is just something I’m using with my
editor so that I don't have to duplicate this. So we have our body it's already in there, so all
I need to do here is actually just paste the url that's going to receive our data. So I’m
going to sign into Integromat which is a platform like Zapier; it allows
you to do so many different things. I’m going to go to scenarios and
I’m going to create a new scenario, and this scenario is going to be a web hook, I’ll
click on webhooks right here and click continue. What it's going to do is that it requires
you to add some particular information, so I’m going to add a webhook name and I’ll call it
“receive cf7 data”, I’ll not restrict any ips, and it's going to give me a url that I can
ping. So I’m going to copy this right here and I’m going to go and paste it inside my
plugin. So we have the url, we have the arguments, we have the remote post. So what we are going
to do is add return at the end of the day when we are done posting all this information.
So our web hook is going to be waiting for the information that's coming, and once we get
the information we'll be able to structure it as it should be. So let me go
back to my form right here, I’ll reload it so that we don't have any
issues, I’m going to say “techiepress 2”, I’ll say give my email, add API sending; that will
be a subject, and message is “here we go”, I’ll hit send, of course we get this working,
the message here we are told the message is sent. Let's come back here to our API, hit determine the data. Now let's go back
to our front end, let's add our techiepress, we'll add techiepress 2, we'll add our
email and add a subject; API sending, and then I’ll say here we go as our
email, click send, and you will see that this has been pinged and that's why we're having
this is successfully determined. So let's click ok and it's going to refresh our data. So on our
webhook what we're going to do is we're going to add something else that's going to show
us what we'll do, and we'll add an iterator, and when I add an iterator here and click on
it, you see it says array, and it's already picking information from the web hook that was
triggered. So we have the name, the email subject and message. This would be a nice tool for you
to look into if you're into automation and so on. I got to know it from a friend who was using
this to automate their processes. So if you like the video give it a thumbs up. If you have
something to say please leave it in the comments, let me know how you're finding this video and
other videos, and if you haven't subscribed consider doing so because there is so much coming from this channel. Otherwise enjoy your day.