Shopify

How to integrate Shopify and Legal Monster.
Legal.js
Our Shopify integration is based on Legal.js, you can extend this integration with all features and settings available in Legal.js like language etc. Read more.
Integrate with your cart
There are a few places you need to hook in to enable Legal Monster to work with Shopify. The first place is your cart, here we have to edit in the Theme code. Go to Online Store, then themes and then click "Actions" and select "Edit code".
Where in the code your cart is depends, in the default theme Debut it's located in a file called cart-template.liquid.
When you have located the template for your cart you should add the following code where you want the consent collection to happen.
<script type="text/javascript">
  !function(){var legal=window.legal=window.legal||[];if(!legal.__VERSION__)if(legal.invoked)window.console&&console.error&&console.error("Legal.js snippet included twice on page.");else{legal.invoked=!0,legal.methods=["document","signup","user","ensureConsent"],legal.factory=function(o){return function(){var e=Array.prototype.slice.call(arguments);return e.unshift(o),legal.push(e),legal}};for(var e=0;e<legal.methods.length;e++){var o=legal.methods[e];legal[o]=legal.factory(o)}legal.load=function(e,o){var t=document.createElement("script");t.type="text/javascript",t.async=!1,t.src="https://widgets-legalmonster-prod.herokuapp.com/v1/legal.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n),legal.__project=e,legal.__loadOptions=o||{}},legal.SNIPPET_VERSION="1.1.0"}}();
​
  legal.load("<<PROJECT PUBLIC KEY>>", {
       locale: 'en-us' });
​
  legal.signup("cart-consent", {
    submitTargetName: "checkout"
  });
</script>
<div id="cart-consent"></div>
It's important the the consent collection is within the form element of the cart and remember to exchange <<PROJECT PUBLIC KEY>> with your project key. Find it here.
Language can be set by changing the locale setting, default is english, but Danish is also supported by changing the setting to 'da-dk'. Read more.​
Checkout conversion
To identify and track the consent in a propper way we need to add a bit of code to your order status page after a checkout have finished. You do that under Settings and Checkout and find the area about Order processing. Here you have an input field for additional scripts, in this field you add the following code:
<script>
  !function(){var legal=window.legal=window.legal||[];if(!legal.__VERSION__)if(legal.invoked)window.console&&console.error&&console.error("Legal.js snippet included twice on page.");else{legal.invoked=!0,legal.methods=["document","signup","user","ensureConsent"],legal.factory=function(o){return function(){var e=Array.prototype.slice.call(arguments);return e.unshift(o),legal.push(e),legal}};for(var e=0;e<legal.methods.length;e++){var o=legal.methods[e];legal[o]=legal.factory(o)}legal.load=function(e,o){var t=document.createElement("script");t.type="text/javascript",t.async=!1,t.src="https://widgets.legalmonster.com/v1/legal.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n),legal.__project=e,legal.__loadOptions=o||{}},legal.SNIPPET_VERSION="1.1.0"}}();
​
  legal.load("<<PROJECT PUBLIC KEY>>", {
    identifier: "{{ customer.id }}",
    locale: "en-us"
  });
  legal.user({
    name: "{{ customer.name }}",
    email: "{{ customer.email }}"
  });
  legal.ensureConsent();
</script>
Remember to exchange <<PROJECT PUBLIC KEY>> with your project key.
System integrations - Previous
Pardot
Next - API
Getting started
Last updated last month