title: JavaScript Dynamic Text in Header Band (with Shopify)
body: <p>I have created a dynamic text header band thanks to a code I have found and adapted to my needs.</p>
  
  <p><a href="https://i.stack.imgur.com/VKTdA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/VKTdA.png" alt="enter image description here"></a></p>
  
  <pre><code>&lt;marquee behavior="scroll" direction="left" scrollamount="3" scrolldelay="60" onmouseover="this.stop()" onmouseout="this.start()" bgcolor="#232F3E"&gt;
  &lt;strong&gt;NOUVEAU : 1 article acheté = &lt;u&gt;&lt;a target="_blank" class="header" href=/pages/arbres title="1 article acheté = 1arbre – Trésor Ethnique"&gt;1 ARBRE PLANTÉ&lt;/a&gt;&lt;/u&gt;&lt;/strong&gt; avec l’association &lt;i&gt;One Tree Planted&lt;/i&gt;
  &amp;nbsp;&amp;nbsp;·&amp;nbsp;&amp;nbsp; 
  Première Commande: 10% de Réduction avec le Coupon BIENVENUE
  &amp;nbsp;&amp;nbsp;·&amp;nbsp;&amp;nbsp; 
  Livraison Suivie OFFERTE 
  &amp;nbsp;&amp;nbsp;·&amp;nbsp;&amp;nbsp;  
  Plus de 5.000 Clientes Satisfaites
   &lt;/marquee&gt;
  </code></pre>
  
  <p>It works pretty well, but I was looking if I could make this one even better.</p>
  
  <p>Indeed, I'd like instead the text to be on 4 different lines.</p>
  
  <p>Every 3 seconds, it would switch (no scroll) to the next line of text (in a vertical movement)</p>
  
  <p>The total sequence would then last 12 seconds</p>
  
  <p>Here is the website: <a href="https://www.tresor-ethnique.com/" rel="nofollow noreferrer">https://www.tresor-ethnique.com/</a></p>
  
  <p>PS: 
  I am using the CMS Shopify, and I have a theme installed.
  As a result, I do not have any control on the HTML.</p>
  
  <p>I just can integrate HTML content on a field.</p>
  
  <p>How to do that?</p>
  
  <p>PS: I use a theme, so I can just enter HTML into the field</p>
  
  <p>I know how to integrate a Javascript code inside HTML if this is needed.</p>