How to make a part of my announcement bar a different color?

[Chicha7272]

Hey everyone, I need some help with coloring my announcement bar.

This is what I have right now:

This is what I want to achieve:

So, how can I do it?

My store URL:https://trivlen.com/

[Spac-es]

You must add an additional container and then apply two styles: the color and the margin (spacing). The code would look like this:

Result:

[Chicha7272]

Got it, but can you please tell me where exactly I should paste it?

[Spac-es]

I need to add HTML to make it work.

Find this file, copy it and send it all to me.

announcement-bar.liquid

I give you the updated code. This way I won’t have to access your store, although I can do it if you want. As you prefer.

[Chicha7272]

You seem to be a cool guy, but I’d still prefer not to give you access since we don’t really know each other. So here’s the screenshot of my file (You can zoom in without losing quality if you download it):

[Spac-es]

Delete all code from line 79 to line 114. The code is something like this:

{%- for block in section.blocks -%} //line 79
  //the rest of the code
{%- endfor -%} //line 114

Add this code instead:

{%- assign isFirstBlock = true -%}
{%- for block in section.blocks -%}
  
    

      {%- if isFirstBlock -%}
        

          Black Friday sale!
          Get up to 50% off!
        

        {%- assign isFirstBlock = false -%}
      {%- elsif block.settings.text != blank -%}
        {%- if block.settings.link != blank -%}
          
        {%- endif -%}
        

          {{ block.settings.text | escape }}
          {%- if block.settings.link != blank -%}
            {% render 'icon-arrow' %}
          {%- endif -%}
        

        {%- if block.settings.link != blank -%}
          
        {%- endif -%}
      {%- endif -%}
    

  

{%- endfor -%}

From the customizer leave the first ad bar as default. Here the text will be automatically added from the code.

I hope it helped you!

[Chicha7272]

Thank you brother, I appreciate your help. I really can’t give you anything in return, but just know you helped a stranger a lot