Shopify Question posted in
The Shopify help center can be found here.

JavaScript code wont work in Shopify… Help :(

I am trying to add another announcement bar at our Shopify store below the current announcement bar so that we have 2 stacked on each other but my Javascript wont work. 🙁

I even followed these guidelines to make sure everything was correct.
Link:https://www.askquesty.com/post/how-to-add-javascript-shopify-tutorial
Can anyone help me out?

My code:

<script>
function insertAfter(referenceNode, newNode) {
  referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}

var el = document.createElement("span.l");
el.innerHTML = "<p class=announcementBar2>FREE SHIPPING</p>";
var div = document.getElementById("announcement-bar");
insertAfter(div, el);
</script>
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Ended up using HTML in the header.liquid

    <div class="promobar-content">

  <div class="bar-inner">
    <span class="header-promotion-text header-promotion-text--desktop">
      <p>FREE SHIPPING with 2 bags</p>
    </span>
  </div>

</div>

  2. 0

    Even though this might work, I wouldn’t recommend using JavaScript for this since it may cause layout shifts. I would modify the announcement bar snippet instead, can you provide the GitHub repo with your theme?

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search