How can I change the color of size ribbons on a Zoomy theme?

Store Design
, , ,
1

I have size ribbons on a theme I’m helping with and the code is hiding well! I THINK I found it but there is no where to change the color of the ribbon, she is wanting it to match her new muted colors. Theme is Zoomy

https://shoprubyrue.com/collections/apparel

Screen Shot 2023-08-31 at 11.02.14 AM.png
Screen Shot 2023-08-31 at 11.02.14 AM.png546×363 193 KB

1 Like
2

Hi @mistytitzer

Can I take a look? Would you mind to share your Store URL website? with password if its protected. Thanks!

3

https://shoprubyrue.com/collections/apparel

password is twahld

1 Like
4

Oh, Im sorry I forgot to ask the color you like.

But you can change it whatever you like. Just be careful only color letter will be delete.

Try this one.

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
.ribbon span {
    background: black;
}

.ribbon span:after {
    border-right: 3px solid black;
    border-top: 3px solid black;
}

.ribbon span::before {
    border-left: 3px solid black;
    border-top: 3px solid black;
}

I hope it help.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

5

I need it to be this color 84ABAC can i just use that color code in place of the black?

6

this did not work :disappointed_face:

1 Like
7

Can you try this one? Replce the code with this.

Same Instruction.

.ribbon span {
    background: #84ABAC !important;
}

.ribbon span:after {
    border-right: 3px solid #84ABAC !important;
    border-top: 3px solid #84ABAC !important;
}

.ribbon span::before {
    border-left: 3px solid #84ABAC !important;
    border-top: 3px solid #84ABAC !important;
}

And Save.

i hope it help.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

8

THIS WORKED! thank you!!!

1 Like