When I want to implement a contact form on any WordPress site, the first plugin that comes into my mind is Contact Form 7. It is easy to add fields in the form, very easy to setup, add emails, implement spam filtering, track form submission with Google analytics, styling the form and so on. So on one of my product’s site, I had set up Contact Form 7.

I started using Freshdesk to handle the support requests as well. But the form that Freshdesk offers to create the ticket or the panel which it offers did not feel well integrated into my Product’s page. I wanted to keep the feel unchanged. Also, I wanted to distinguish between my product customers and general queries. So I thought why not integrate Contact Form 7 with Freshdesk. The final goal was that when someone submits the form created using Contact Form 7, automatically a ticket should be submitted to Freshdesk.

I am using Freshdesk API V2 and Contact Form 7 version 4.9

The action triggered when a form is submitted is ‘wpcf7_mail_sent’. We can hook our function which creates the ticket to this hook. This function can receive the actual contact form i.e. fields and settings etc that was submitted. The thing is we do not need contact form, we need the data that the user has submitted thru the form. This data can be obtained from the below function

[php]WPCF7_Submission::get_instance();[/php]

The above function returns all the submission data along with contact form, field names, all the settings and values, all the messages that are saved in Contact Form 7 settings and finally the actual data submitted by the submitter. We just need this submitted data. We can get it using the get_posted_data() method on the submission instance. i.e.

[php]$submission = WPCF7_Submission::get_instance();
$submission = WPCF7_Submission::get_instance();
if ( $submission ) {
$posted_data = $submission->get_posted_data();
}[/php]

The $posted_data will contain something similar to

[php]Array ( [_wpcf7] => 1865 [_wpcf7_version] => 4.9 [_wpcf7_locale] => en_US [_wpcf7_unit_tag] => wpcf7-f1865-p1942-o1 [_wpcf7_container_post] => 1942 [your-name] => Example Name [your-email] => example@test.com [your-subject] => Test subject [your-message] => Testing the integration of Contact Form 7 and Freshdesk )[/php]

So now you get the data that visitor/user entered when she submitted the form i.e. in the array fields [your-name], [your-email], [your-subject] , [your-message]

If you have added more fields to the form while creation, you will get those values too here.

Now we have

1. The action hook triggered when Contact from is submitted
2. The actual data when someone submits the form

And we need:

1. Freshdesk API Key – Get it here
2. Your helpdesk domain name – If your helpdesk url is like https://mydomain.freshdesk.com/, the domain name would be ‘mydomain’

How to create data/JSON array to post to Freshdesk Create Ticket API

We will send the below data in order to create a ticket on Freshdesk

1. Name of the customer
2. Her Email
3. The subject i.e. ticket title
4. The actual issue i.e. ticket message
5. Priority of the ticket i.e. High, Medium or Low
6. Status of the ticket i.e. Open or Pending etc
7. We can optionally send Product ID if we are using Multiple Products on Freshdesk
8. The ticket source i.e. email or phone or portal etc
9. CC email i.e. if an email needs to be sent to admin or any email once the ticket is successfully created

The JSON array can be constructed from the available data as follows:

[php]$ticket_data = json_encode(array(
"name" => $posted_data["your-name"],
"email" => $posted_data["your-email"],
"subject" => $posted_data["your-subject"],
"description" => $posted_data["your-message"],
"priority" => 1,
"status" => 2,
"product_id" => 0000000000, //enter your product id if any (if you use Multiple Products)
"source" => 2,
"cc_emails" => array("notifyme@gmail.com")
));
[/php]

As we will be using cURL to connect to the Freshdesk server, make sure the cURL extension is enabled on your server PHP. The complete code would look as follows:

[php]add_action( ‘wpcf7_mail_sent’, ‘td_freshdesk_create_ticket’, 0, 1 );
//Un-comment below line if you want to enable ticket creation in case the contact form submission fails. I used it when I was testing the code.
//add_action( ‘wpcf7_mail_failed’, ‘td_freshdesk_create_ticket’, 0, 1 );
function td_freshdesk_create_ticket( $contact_form ){
$submission = WPCF7_Submission::get_instance();
if ( $submission ) {
$posted_data = $submission->get_posted_data();
}

if( trim( $posted_data["your-email"] ) != ” ):
$api_key = "xxxxxxxxxxxxxxxxxxxx"; //your Freshdesk API key
$password = "x";
$yourdomain = "mydomain";//your helpdesk domain name. If your helpdesk url is like http://mydomain.freshdesk.com/ , you need to use ‘mydomain’ here
$ticket_data = json_encode(array(
"name" => $posted_data["your-name"],
"email" => $posted_data["your-email"],
"subject" => $posted_data["your-subject"],
"description" => $posted_data["your-message"],
"priority" => 1,
"status" => 2,
"product_id" => 0000000000, //enter your product id if any (if you use Multiple Products)
"source" => 2,
"cc_emails" => array("notifyme@gmail.com")
));
$url = "https://$yourdomain.freshdesk.com/api/v2/tickets";
$ch = curl_init($url);

$header[] = "Content-type: application/json";

//Set CURLOPT_SSL_VERIFYPEER to 0 if you are testing on localhost or on a site with no https/SSL – Disable verify the peer’s SSL certificate
//curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, 0);

curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_HTTPHEADER, $header);
curl_setopt($ch, CURLOPT_HEADER, true);
curl_setopt($ch, CURLOPT_USERPWD, "$api_key:$password");
curl_setopt($ch, CURLOPT_POSTFIELDS, $ticket_data);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

$server_output = curl_exec($ch);
//print curl_error($ch); //print the error in the last curl operation i.e. exec
/*********************
The below code can be used to debug or process the response from the Freshdesk server. You can use it as per your requirement
**********************/
//$info = curl_getinfo($ch);
//$header_size = curl_getinfo($ch, CURLINFO_HEADER_SIZE);
//$headers = substr($server_output, 0, $header_size);
//$response = substr($server_output, $header_size);
//if($info[‘http_code’] == 201) {
// echo "Ticket created successfully, the response is given below \n";
// echo "Response Headers are \n";
// echo $headers."\n";
// echo "Response Body \n";
// echo "$response \n";
//} else {
//if($info[‘http_code’] == 404) {
// echo "Error, Please check the end point \n";
//} else {
// echo "Error, HTTP Status Code : " . $info[‘http_code’] . "\n";
// echo "Headers are ".$headers;
// echo "Response are ".$response;
//}
//}
/*************************
Debug code ends
*************************/

//Close connection
curl_close($ch);
endif; //if the contact form is posted with valid email
}[/php]

Contact form 7 submits using AJAX. While testing you can disable the AJAX submission by adding the below line – The below filter will prohibit the load of Contact Form JS.

[php]add_filter( ‘wpcf7_load_js’, ‘__return_false’ );[/php]

cURL not able to connect to API on localhost

In case you are testing the code on localhost, where SSL is not enabled, make sure you have set the CURLOPT_SSL_VERIFYPEER option to 0.

[php]curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, 0);[/php]