This guide will help you implement Universal Integration on the Shoper platform.
The integration consists of 3 steps:
1. Adding an initialization script
2. Generating a product feed on the platform and implementing it in the edrone panel
3. Adding the script to the Thank You Page of your store, i.e. on the page confirming the purchase.
All the scripts that need to be added can be found in the edrone documentation at docs.edrone.me, in the Other section, and then in the “Integrate with universal integration” tab (LINK). You will also find a short and general explanatory manual.
Step 1: Adding the initialization script.
ATTENTION: AT THE END OF POINT ONE YOU WILL FIND A READY SCRIPT FOR COPYING IN WHICH JUST CHANGE YOUR APP_ID
Shoper provides a special tab on its platform called "Own integrations" in the "Add-ons and integrations" section, where you can easily add such a script.
Go to this tab on the platform.
In this tab, you can add scripts in various elements of the HTML code of the page. Our initialization script needs to be added in the HEAD section of the HTML code and the first console allows us to do so, so copy the script from our documentation.
In this script, you need to make some modifications, i.e. replace the identifier which is the APP ID, and the email parameter and first_name. You can find the APP ID of your store in the edrone panel in the Settings -> Integration -> Platforms tab
After copying it, replace it in two places in the script.
Then you need to change the email and first_name parameters:
These are variable data - the data sent to the edrone system will differ by e-mail address and name (during implementation the second script in point 3 with other, additional data, but we will get to this point), so it means that we must specify the appropriate parameter that will display this variable value. To replace these fields, you must use the documentation prepared by Shoper. Just click the link above the text console window for "Order confirmation" and the appropriate tab will open.
Look for the variable responsible for displaying the email address and copy it completely, including the brackets. Replace it in the appropriate line. Do the same with the first_name parameter. When you replace the necessary fields, do not forget to save the script by pressing the "SAVE" button.
This is how the script should look like after replacing the data (except APP ID, because you paste your unique ID there):
Below you will find a ready code in which you just need to replace your APP ID with your unique one.
<script type="text/javascript">
(function (srcjs) {
window._edrone = window._edrone || {};
_edrone.app_id = 'YOUR_APP_ID';
_edrone.platform = 'universal';
_edrone.email = '{email}';
_edrone.first_name = '{bill_firstname}';
let doc = document.createElement('script');
doc.type = 'text/javascript';
doc.async = true;
doc.src = ('https:' === document.location.protocol ? 'https:' : 'http:') + srcjs;
let s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(doc, s);
})("//d3bo67muzbfgtl.cloudfront.net/edrone_2_0.js?app_id=YOUR_APP_ID");
</script>
We have completed the first step, i.e. the implementation of the initialization script.
Step 2: Generate a product feed and implementation in the edrone system.
Go to the “Other Integrations” tab on the Shoper platform, then click the configure button for Google Products.
In this section, change the status to "Activity" and click on the link to the XML document. In this way, you will generate a product feed in the form of an XML link in the Google Merchant Center format, which is one of the three formats accepted by edrone (except CENEO and IAI).
Now you need to implement it in edrone, so go to the main panel of your store in edrone, and then to the Settings -> Product Feed section. Click the "IMPORT NEW FEED" button and paste the link generated on the platform. Then select "OK" and the feed is implemented - note that its processing may take from several minutes to several hours - depending on its size and the number of products it contains.
Step 3: Implement the script on your website, which is displayed after placing the order.
ATTENTION: AT THE END OF POINT ONE YOU WILL FIND A READY SCRIPT FOR COPYING IN WHICH JUST CHANGE YOUR APP_ID
This script is a bit more complicated than the previous one, so I'll show you what it should look like and you can recreate it almost 1 to 1 on your platform. Go to the shop platform again, to the "Own integrations" section. This time we will use the field called "Order confirmation", which is our Thank You Page.
Copy the script from the documentation - this time another one you can find there and paste it into the console.
As with the first script, it requires modification of variable values.
The first one is to replace the APP ID field, in exactly the same way as in the previous script - you can even copy it from the first text field.
In the next steps, you need to replace the remaining fields, i.e. email, first_name, product_id, order_id and order_value with appropriate tags that are acceptable by the Shoper store platform - exactly as in the case of the first initialization script. Go back to the Shoper documentation.
The field responsible for the product_ids is more complex - without much detail, but the product information is passed in a loop, so this field will look a bit different, but don't worry - you can reproduce exactly what I do and it will be correct.
In the case of product_ids, we have a start and end tag, between which a tag specifying the product id must be displayed, and which must be separated by a PIPE character (you will find it under the backspace on the keyboard).
We replace the remaining field exactly like the e-mail variable, i.e. we look for appropriate tags in the documentation and paste them into our script.
When we have replaced all the necessary fields, click "SAVE" at the bottom.
Below you will find a ready code in which you just need to replace your APP ID with your unique one.
<script type="text/javascript">
(function () {
window._edrone = window._edrone || {};
_edrone.app_id = 'YOUR_APP_ID';
_edrone.email = '{email}'
_edrone.first_name = '{bill_firstname}';
_edrone.platform = 'universal';
_edrone.action_type = 'universal_order'
_edrone.product_ids = '{products}{products.product_id}|{/products}'; // use "|" sign to separate products from each other
_edrone.order_id = '{order_id}';
_edrone.order_payment_value = '{sum}';
})();
</script>
VERIFICATION
Also contact your supervisor or write to hello@edrone.me. We will check the correctness of the integration for you and make connections to all newsletter subscription forms available on the store's website. I hope that the whole integration process was successful.
Need more help?
If you have any further questions about working with integration with Shoper on edrone, please do not hesitate to contact us at hello@edrone.me