Hoe beperk ik het verzendgebied voor mijn webshop?

Als je het verzendgebied wilt beperken tot een bepaalde postcode, kun je de code in dit artikel kopiëren en in je Creator-webshop plakken. Je moet de code een beetje aanpassen om te zorgen dat hij past bij wat je nodig hebt.

Let op

Kopieer de code hieronder in het Head-gedeelte van je website door naar het menu te gaan en te klikken op Instellingen > HEAD-gedeelte.

value: 'Buiten verzendgebied' (rood gemarkeerd): Dit is het bericht dat gebruikers zien als ze een postcode invoeren die buiten het verzendgebied ligt. Houd er rekening mee dat dit bericht in de meeste browsers goed overkomt, maar dat hij in Safari en op Safari gebaseerde browsers er misschien uitziet als een standaard browserbericht.

value: '254[3-6]{2}' (gemarkeerd in groen): Deze waarden zijn een voorbeeld van een postcodebereik. In dit voorbeeld bepalen we dat de eerste drie cijfers 254 moeten zijn. De volgende cijfers kunnen tussen 3 en 6 liggen en na de eerste drie cijfers zijn slechts 2 cijfers toegestaan.

Wil je het verzendgebied nog verder beperken, dan kun je deze waarden vervangen door value: '254[1-9]{1}'. Dan is het postcodebereik 2541-2549.

Code

<script type="text/javascript">
// implements some native browser validation logic on ZipCode inputs 
// that are part of the checkout process forms
//<![CDATA[

function docReady(fn) {
    // see if DOM is already available
    if (document.readyState === 'complete' || document.readyState === 'interactive') {
        // call on next available tick
        setTimeout(fn, 1);
    } else {
        document.addEventListener('DOMContentLoaded', fn);
    }
}  

docReady(function(){
    if (
        (document.body.className.indexOf('j-shop-special-page') > -1 ) &&
        document.getElementsByClassName('j-checkout__shipping-address-checkbox').length > 0
     ) {
         // initial state
         addZipCodePattern(false);
        
        // if user changes state of "other shipping address" checkbox 
        var otherShippingAdressCheckBox = document.getElementsByClassName('j-checkout-address-checkbox__box')[0];
        otherShippingAdressCheckBox.addEventListener('change', function(){
            addZipCodePattern(otherShippingAdressCheckBox.checked);
        });
    }
});

function addZipCodePattern(shippingPartOnly) {
    var billingZipCodeInput = document.getElementById('id_billing_zip');
    var shippingZipCodeInput = document.getElementById('id_shipping_zip');
    var pattern = {name: 'pattern', value: '254[3-6]{2}'};
    var title = {name: 'title', value: 'Buiten verzendgebied'};
    
    // exit if one of both isnt found
    if (!billingZipCodeInput || !shippingZipCodeInput) return; 
    
    if (shippingPartOnly) {
        shippingZipCodeInput.setAttribute(pattern.name, pattern.value);
        shippingZipCodeInput.setAttribute(title.name, title.value);
        billingZipCodeInput.removeAttribute(pattern.name);
        billingZipCodeInput.removeAttribute(title.name);
    } else {
        billingZipCodeInput.setAttribute(pattern.name, pattern.value);
        billingZipCodeInput.setAttribute(title.name, title.value);
        shippingZipCodeInput.removeAttribute(pattern.name);
        shippingZipCodeInput.removeAttribute(title.name);
    }
}

//]]>
</script>