1) In your theme file, paste this code:
<script>
(function(d,s,i){
if(d.getElementById(i)){return;}
var t=d.createElement(s);t.id=i;
t.rel='stylesheet';
t.href='https://{yoursubdomain}.shipearlyapp.com/widgets/dist/shipearly-widgets.min.css';
d.head.appendChild(t);
})(document,'link','shipearly-widgets-css');
(function(d,s,i){
if(d.getElementById(i)){return;}
var t=d.createElement(s);t.id=i;
t.src='https://{yoursubdomain}.shipearlyapp.com/widgets/dist/shipearly-widgets.min.js';
var f=d.getElementsByTagName(s)[0];
f.parentNode.insertBefore(t,f);
})(document,'script','shipearly-widgets-js');
</script>
<script>
(function() {
const clientId = 'INSERT API KEY';
document.querySelectorAll('form button[name="shipearly-locator"]').forEach(function(el) {
el.classList.toggle('hidden', !clientId);
el.addEventListener('click', function(e) {
e.preventDefault();
ShipEarly.ProductLocator({
client_id: clientId,
variant_id: this.closest('form')?.querySelector('[name="id"]')?.value || (new URLSearchParams(window.location.search)).get('variant'),
}).render('body', 'modal');
});
});
})();
</script>
2) We need to then add some code for each product Page to create a button
<button type="button" name="shipearly-locator" class="product-form__submit button button--full-width button--primary hidden">Check Local Dealer</button>
Comments
0 comments
Article is closed for comments.