Google Tag Manager example: Format address

Storeganise does not offer support for GTM use or guarantee that any custom GTM code will work within Storeganise. Additionally, periodic updates to the Storeganise API could impact or even break how custom GTM code works. Please note also that many users may not see changes made via GTM due to the widespread use of ad-blockers.

Here's a Google Tag Manager tag example to format your address with multiple lines

Create a GTM "Custom HTML" tag

<script>
setTimeout(function () { // wait for react to render
  var addr = document.getElementById('unitOrder.account.address') || document.getElementById('valetOrder.area.address');
  if (!addr) return;
  
  addr.addEventListener('change', function () { // ensure address 1st line not too long
    if (addr.value.split('\n')[0].length > 29) {
      addr.value = addr.value.replace(',', ',\n'); // add line return after first comma
    }
    if (addr.value.split('\n')[0].length > 29) {
      addr.value = addr.value.slice(0, 10) + addr.value.slice(10).replace(' ', ' \n'); // add line return after first space beyond chars
    }
    if (addr.value.split('\n')[0].length > 29) {
      addr.value = addr.value.slice(0, 29) + '\n' + addr.value.slice(29); // force line return in last resort
    }
    
    // refresh page because else react.js won't update the form value
    var url = new URL(window.location);
    url.searchParams.set('address', addr.value);
    window.location = url;
  });
  
}, 200);
</script>

Add 2 triggers: DOM Ready and History change similarly to the Add to waitlist example

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us