Help: Snipcart Integration

Hey brother, why do we have to add this code ? Is it because the nav bar doesnt hide ? i tried it, it doesnt work, i mean the code :grinning:

You’re using a sticky navbar so it’ll hide the top section of snipcart pages. I tested the code before sending, I’ll check your site again

Yes you can check, I put it inside the footer as you said, but still :confused:

My bad. There were some mistakes in how you pasted your code; There were quotation marks (“”) around the code and you didn’t add the script opening () tags. Copy and paste it like this.

<script>
document.addEventListener("snipcart.ready", function(){
window.addEventListener("hashchange", () => {
    const currentUrl = window.location.href;
    const subPaths = [
      "cart",
      "register",
      "signin",
      "dashboard",
      "forgot-password",
      "checkout"
    ];
    console.log(currentUrl);
    const navbar = document.querySelector("#nav-symbol");
    //if current url contains any of the subpaths, hide navbar
    if (subPaths.some((v) => currentUrl.includes(v))) {
      navbar.style.display = "none";
    } else {
      navbar.style.display = "flex";
    }
  });

});
</script>

HI @4Purplemoji , Are you able to help me?
Look I have done the add-to-cart stuff but I got stuck when I goes for checkout. I have used the Deferred Payments because I don’t need any transactions. but when I click “Place order” this error occurred.
image

I have used data-item-url=“[Shop - Travis Weihermuller] but this is not working.
Kindly tell me what I made mistake.

Data item url should be set like this: data-item-url=“/products/slug”

I have a collection template called products then slug represents each product.

Let me know if this helps.

Hello @4Purplemoji , can you help me, sir?
I’ve been trying your code but its still doesnt work, my navbar still covered the snipcart page. This is how I add the code in the design.

<script>
    window.SnipcartSettings = {
        publicApiKey: 'mypublicapi',
        loadStrategy: 'on-user-interaction',
    };

    (()=>{var c,d;(d=(c=window.SnipcartSettings).version)!=null||(c.version="3.0");var s,S;(S=(s=window.SnipcartSettings).timeoutDuration)!=null||(s.timeoutDuration=2750);var l,p;(p=(l=window.SnipcartSettings).domain)!=null||(l.domain="cdn.snipcart.com");var w,u;(u=(w=window.SnipcartSettings).protocol)!=null||(w.protocol="https");var f=window.SnipcartSettings.version.includes("v3.0.0-ci")||window.SnipcartSettings.version!="3.0"&&window.SnipcartSettings.version.localeCompare("3.4.0",void 0,{numeric:!0,sensitivity:"base"})===-1,m=["focus","mouseover","touchmove","scroll","keydown"];window.LoadSnipcart=o;document.readyState==="loading"?document.addEventListener("DOMContentLoaded",r):r();function r(){window.SnipcartSettings.loadStrategy?window.SnipcartSettings.loadStrategy==="on-user-interaction"&&(m.forEach(t=>document.addEventListener(t,o)),setTimeout(o,window.SnipcartSettings.timeoutDuration)):o()}var a=!1;function o(){if(a)return;a=!0;let t=document.getElementsByTagName("head")[0],e=document.querySelector("#snipcart"),i=document.querySelector(`src[src^="${window.SnipcartSettings.protocol}://${window.SnipcartSettings.domain}"][src$="snipcart.js"]`),n=document.querySelector(`link[href^="${window.SnipcartSettings.protocol}://${window.SnipcartSettings.domain}"][href$="snipcart.css"]`);e||(e=document.createElement("div"),e.id="snipcart",e.setAttribute("hidden","true"),document.body.appendChild(e)),v(e),i||(i=document.createElement("script"),i.src=`${window.SnipcartSettings.protocol}://${window.SnipcartSettings.domain}/themes/v${window.SnipcartSettings.version}/default/snipcart.js`,i.async=!0,t.appendChild(i)),n||(n=document.createElement("link"),n.rel="stylesheet",n.type="text/css",n.href=`${window.SnipcartSettings.protocol}://${window.SnipcartSettings.domain}/themes/v${window.SnipcartSettings.version}/default/snipcart.css`,t.prepend(n)),m.forEach(g=>document.removeEventListener(g,o))}function v(t){!f||(t.dataset.apiKey=window.SnipcartSettings.publicApiKey,window.SnipcartSettings.addProductBehavior&&(t.dataset.configAddProductBehavior=window.SnipcartSettings.addProductBehavior),window.SnipcartSettings.modalStyle&&(t.dataset.configModalStyle=window.SnipcartSettings.modalStyle),window.SnipcartSettings.currency&&(t.dataset.currency=window.SnipcartSettings.currency),window.SnipcartSettings.templatesUrl&&(t.dataset.templatesUrl=window.SnipcartSettings.templatesUrl))}})();

  document.addEventListener("snipcart.ready", function(){
	window.addEventListener("hashchange", () => {
    const currentUrl = window.location.href;
    const subPaths = [
      "cart",
      "register",
      "signin",
      "dashboard",
      "forgot-password",
      "checkout"
    ];
    console.log(currentUrl);
    const navbar = document.querySelector("#nav-symbol");
    //if current url contains any of the subpaths, hide navbar
    if (subPaths.some((v) => currentUrl.includes(v))) {
      navbar.style.display = "none";
    } else {
      navbar.style.display = "flex";
    }
  });

});
</script>

This is for the read-only link Webflow - Pupuktlur thank you so much!

@mfathi

Did you add the code in your custom code site settings?