Sending data from websites to overlays

If you need to send any data or value from your website to your overlays, please, follow these steps:

You need to create a field on your website. That is the source of your data that can be sent to Picreel. The field should look similar to:

<input type="hidden" id="test1" class="picreel-popup-data" value="123">

So, if you need to send the value “123” to Picreel overlay, and the id of the field is “test1”, you need to place this line in your Picreel overlay:

<input type="hidden" id="test1" value="">

Do that for any value you need to send -- a field on your website, and the same field in your Picreel overlay. Use Picreel’s HTML editor to modify your overlays.

Data is sent before overlay is displayed.

Do that for any value you need to send -- a field on your website, and the same field in your Picreel overlay. Use Picreel’s HTML editor to modify your overlays.

Data is sent before overlay is displayed.

 

There is another way to send values from your website to overlay form, which is done via JS. In this case you need to add "picreel_popup_loaded" event listener on your website.

document.addEventListener('picreel_popup_loaded', function(){ var data = { somedata1: "some value 1", somedata2: "some value 2", }; picreel.api.push('send_data_picreel', data); });

 

In the listener you need to create an object that will contain key and value. The key is "id" part of "hidden" field in the overlay form, which is assigned to some value.

 

API method picreel.api.push('send_data_picreel', data) is responsible for sending the data. Here, data is the previously created object. Picreel development team recommends to send the data before overlay triggers.

 

When you create an overlay, you need to add "hidden" fields for each element of data object. In this example:

<input type="hidden" name="somedata1" id="somedata1" value=""> <input type="hidden" name="somedata2" id="somedata2" value="">

The data from website is set in these fields. Please, note that "name" should be identified and can be different from "id".

Also, you need to notify Picreel support so that we allow API access to your website.