Skip to content

Instantly share code, notes, and snippets.

@csalzano
Last active July 4, 2024 04:26
Show Gist options
  • Save csalzano/dfd754e0fe8b6ac10731fad8f257c0bf to your computer and use it in GitHub Desktop.
Save csalzano/dfd754e0fe8b6ac10731fad8f257c0bf to your computer and use it in GitHub Desktop.
Elementor Form additional webhook example
<?php
/**
* Plugin Name: Elementor Form Additional Webhook
* Plugin URI: https://gist.github.com/csalzano/dfd754e0fe8b6ac10731fad8f257c0bf
* Description: Adds a second Webhook to an Elementor form
* Version: 1.0.1
* Author: Corey Salzano
* Author URI: https://breakfastco.xyz/
* License: GPLv2 or later
* License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/
class Elementor_Form_Additional_Webhook {
function hooks(){
//Add our additional webhook right here
add_action( 'elementor_pro/forms/new_record', array( $this, 'manipulate_form_submission' ), 10, 2 );
}
function manipulate_form_submission( $record, $ajax_handler ) {
$form_data = $record->get_formatted_data();
//change the names of fields before we send them somewhere
$new_data = array(
'First_Name' => $form_data['First Name'] ?? '',
'Last_Name' => $form_data['Last Name'] ?? '',
'URL' => $form_data['Website'] ?? '',
);
$response = wp_remote_post( 'http://api.somewhere.com/', array( 'body' => $new_data ) );
//if the failure of our additional webhook should prevent the form from submitting...
if( is_wp_error( $response ) ) {
$msg = 'There was a problem with the additional webhook.';
$ajax_handler->add_error( 0, $msg );
$ajax_handler->add_error_message( $msg );
$ajax_handler->is_success = false;
}
}
}
$elementor_webhook_239909870234 = new Elementor_Form_Additional_Webhook();
$elementor_webhook_239909870234->hooks();
@Asikur22
Copy link

Asikur22 commented Mar 9, 2021

//Get the Elementor form ID
$form_id = $record->get_form_settings( 'id' );

//Get the Elementor form name
$form_name = $record->get_form_settings( 'form_name' );

@maxcelos
Copy link

Thank you! It helps a lot.

@jeroenvermunt
Copy link

Thanks a lot for this snippet.

A great addition would be to include query params! For me this is a difficult as I am not familiar with php

@Asikur22
Copy link

query params

Not sure what do you mean by 'query params'

@jeroenvermunt
Copy link

pass the query parameters in the url of the page to the webhook.

For example, I have a form with only the field $question, and a webuser is on the page 'www.domain.com/questions/?user=123'.

Then I want to have a post request like so:

//change the names of fields before we send them somewhere
		$new_data = array(
			'question' => $form_data['Question'] ?? '',
                        'user' => $query_parameters['user'] ?? ",
		);

@Asikur22
Copy link

The easiest way to get query parameter from URL, you can create a new form field and set the default value from the URL query parameter. And get it as a field in the webhook

image

@jeroenvermunt
Copy link

Thanks a lot!

I cannot get the action to work, should it work if I place the gist in elementor-pro/modules/forms/actions file?

@Asikur22
Copy link

Put these codes to your theme 'functions.php' file.

@emiliodom
Copy link

Thanks so much, 5 hours wasted before this

@johnnny-bravoo
Copy link

@csalzano @Asikur22 - I'm trying to use that Webhook for the Lawmatrics integration. The API key is like:

https://api.lawmatics.com/v1/forms/067a0d61-ed44-4bb6-XXXXX/submit

and the documentation link is:

https://docs.lawmatics.com/#b590b79e-529f-42ec-b79b-9d9bc3e5de24

I dont' know why it's not passing data through API. Can you please help on this. Thank you.

@Asikur22
Copy link

Asikur22 commented Jul 4, 2024

@johnnny-bravoo, you need to send the data as JSON by setting the request header and need to use json_encode() function to encode the data array.

@johnnny-bravoo
Copy link

@Asikur22 thank you for your reply. I also tried with the data encoded in JSON, i.e:

$response = wp_remote_post( 'https://api.service.com', [ 'body' => json_encode($data), 'headers' => [ 'Content-Type' => 'application/json', ], ] );
'
but get error in add_response_data. Here is the source link: https://intermarketing.merkados.com/customizing-webhook-calls-in-elementor-pro

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment