Front-end Integration

forter javascript snippet the full js snippet for both production and sandbox environments can be found here https //portal forter com/app/integration/js snippets make sure to use the correct script (sandbox vs production) depending on what environment you're integrating your script or pixel shopify pixel integration (checkout extensibility) all shopify merchants should follow the below instructions for creating and enabling a shopify custom pixel as well as pasting the forter snippet into the native html for your respective shopify checkout component more information about shopify's custom pixel framework can be found here https //help shopify com/en/manual/promoting marketing/pixels/custom pixels step 1 paste the snippet into your shopify theme navigate to this path https //admin shopify com/store/\<your sandbox shop com>/themes and then select the theme liquid option click the “edit button to the right to access the html code 2\ copy & paste the forter javascript snippet into the editor make sure you're using the snippet with the siteid that corresponds to the shopify environment you're adding the script to (i e "production snippet for your production store" or "sandbox snippet for your sandbox store") 3\ press save to save your changes step 2 log into your admin log into your shopify admin, go to settings > customer events and click on the add custom pixel option step 3 name your pixel name your snippet if you enter the name of a custom pixel that already exists, then you'll be prompted to give your pixel a different name forter recommends "forter snippet" step 4 paste your template and forter site id click "add pixel" to open the event editor go to the code window and paste and use the following template window api = api; const script = document createelement('script'); script setattribute('type', 'text/javascript'); script setattribute('id', '%site id%'); // where siteid is the siteid from your forter portal (select sandbox or prod siteid according to the environment you're adding your pixel) script text = `%snippet content from portal%`; // your forter js snippet (select the sandbox or prod snippet depending on the env you're adding your pixel) document head appendchild(script); for the '%site id% field in the template, update it to the siteid value located in your forter portal settings page https //portal forter com/app/integration/credentials/ be sure to be toggled to the appropriate portal environment so that you're using the correct siteid (production vs sandbox) step 5 paste your forter javascript snippet once you've pasted the above template, go to the javascript integration page https //portal forter com/app/integration/js snippets of your forter portal have the script you're planning to add (sandbox or production) in view so that you're ready to paste it make sure you paste the entire snippet ( %snippet content from portal% ) with the correct environment (production or sandbox) from the forter portal but exclude the opening and closing \<script> tags of the snippet step 6 select permission in the customer privacy section of your shopify pixel, select the following not required for the permission data collected does not qualify as data sale this will allow forter's pixel to load even when a customer opts out of marketing or advertising targeting step 7 save and activate click save to save your custom pixel and then click "connect pixel" to start tracking your events step 8 confirm activation go to your store's theme section themes https //admin shopify com/store/ and confirm that the forter pixel is enabled in the "app embeds" section, then click on the "save" button testing your js integration you can take the following steps to verify that the forter javascript integration is collecting the relevant cyber and behavioral data on orders make sure your forter team has activated the js script this means the cdn has been activated and the script can dynamically render a token and track relevant front end events visit your website \<your site> myshopify com and place an order like a customer perform normal customer behaviors such as searching for a product, selecting a product size, and carting a product then proceed to checkout use the credit card or shoppay (saved credit card) payment method you can use any email address or one of forter's test emails like approve\@forter com or decline\@forter com in the sandbox environment if you want to force a specific decision once you've placed the order, log into your forter portal, and visit the transactions tab https //portal forter com/app/dashboard/transactions and search for your test transaction by email or order id 4\ once you've found the transaction, check the cyber intelligence and behavioral sections of the detailed order view where you should see highlights of what the script and request headers of the order have collected 5\ confirm with your forter team let your forter team know that you've completed this work and so that they can validate configurations as well