Announcement Bar Issue ( Shopify Prestige Theme )

[dreamtechzone_5]

Hello Everyone!

I am using Shopify prestige theme. I have added announcement bar through coding. But I want announcement bar to change after 5 seconds or 10 seconds. Please help me. Thank you.

Store: https://delicious-fruits-vegetables.myshopify.com/

Password: Admin

[freejace345]

I see it, can i help you ?

[dreamtechzone_5]

Yes, Then it will be very beneficial. Thank you.

[freejace345]

freejace10@gmail.com this is my email you can add me as a staff or should i send a colllaburation?

[dreamtechzone_5]

Can you give me the code here and give instructions? That will help everyone.

I used this code.

{%- if section.settings.enable_bar -%}

{%- unless section.settings.home_page_only and template != 'index' -%}

<section id="section-{{ section.id }}" data-section-id="{{ section.id }}" data-section-type="announcement-bar">

  <div class="AnnouncementBar">

    <div class="AnnouncementBar__Wrapper">

      {%- for block in section.blocks -%}

      {%- if block.type == 'announcement_bar' -%}

      <p class="AnnouncementBar__Content Heading">

        {%- if block.settings.link -%}

        <a href="{{ block.settings.link }}">{{ block.settings.content | escape }}</a>

        {%- else -%}

        {{ block.settings.content | escape }}

        {%- endif -%}

      </p>

      {%- endif -%}

      {%- endfor -%}

    </div>

  </div>

</section>

<style>

  #section-{{ section.id }} {

    background: {{ section.settings.background }};

    color: {{ section.settings.text_color }};

  }

  .AnnouncementBar__Content.Heading {display: none;}

</style>

<script>

  document.documentElement.style.setProperty('--announcement-bar-height', document.getElementById('shopify-section-announcement').offsetHeight + 'px');

</script>

<script>

  (function() {

      var quotes = $(".AnnouncementBar__Content.Heading");

      var quoteIndex = -1;

      function showNextQuote() {

        ++quoteIndex;

        quotes.eq(quoteIndex % quotes.length)

        .fadeIn(1000)

        .delay(1000)

        .fadeOut(1000, showNextQuote);

      }

      showNextQuote();

    })();

</script>

{%- endunless -%}

{%- endif -%}

{% schema %}

{

  "name": "Announcement bar",

  "settings": [

      {

        "type": "checkbox",

        "id": "enable_bar",

        "label": "Enable bar",

        "default": true

      },

      {

        "type": "checkbox",

        "id": "home_page_only",

        "label": "Home page only",

        "default": false

        },

      {

        "type": "color",

        "id": "background",

        "label": "Background",

        "default": "#000000"

      },

      {

        "type": "color",

        "id": "text_color",

        "label": "Text",

        "default": "#ffffff"

      }

    ],

  "blocks": [

    {

          "type": "announcement_bar",

          "name": "Announcement Bar",

          "settings": [

                  {

                    "id": "content",

                    "type": "text",

                    "label": "Announce something here"

                  },

  {

                    "id": "link",

                    "type": "url",

                    "label": "Link"

                  }

             ]

}

],

"presets":[

    {

      "name":"Announcement bar"

    }

  ]

  }

{% endschema %}