How to change the text color of button Shop Now on image banner?

Store Design
, , ,
1

Hello everyone,i need to change the color of the text from black to white color in button shop now,i use impulse theme and also in cart homepage icon how can show the numbers because its just a color without numbers on it

Screenshot_20240831_124427_Chrome.jpg
Screenshot_20240831_124427_Chrome.jpg1080Ă—791 47.5 KB

Screenshot_20240831_124452_Chrome.jpg
Screenshot_20240831_124452_Chrome.jpg1076Ă—223 8.42 KB

2

Hey @VisarK

It seems like it’s a draft theme which you’re working on, so can you share a preview URL of the draft theme?

Best Regards,

Moeed

3

In your theme settings, you can define your color schemas. You can change the button text color to white there and it will automatically update for all the components that are using that schema.
If you only want to change it for this section, create a new color schema that matches the current one only with the button color changed. Then assign it in the section settings.

4

Yes @Moeed

https://pawshubs.com/?_ab=0&_fd=0&_sc=

1 Like
5

Hey @VisarK

The URL you shared isn’t the preview URL of the draft theme. To share the preview url, Preview your website on the draft theme and in the bottom you will see a button called “Share Preview”. Copy that link and share here.

Best Regards,

Moeed

1 Like
6

Ah okay i didnt know @Moeed

https://ylkn7380n2x0fnt5-73297297711.shopifypreview.com

1 Like
7

Hey @VisarK

There’s already a coded added in your theme, try searching for that code in theme.liquid file and if you find it then replace #000 with “white”.

.slideshow__slide--1524769873765-0 .btn {
    background: #c19a6b !important;
    border: none;
    color: #000 !important;
}

RESULT:

Moeed_0-1725220891961.png
Moeed_0-1725220891961.png1873Ă—821 167 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

8

It doesnt work @Moeed

9

Hi @VisarK

Check this one.

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

.hero .slideshow__slide a.btn {
    color: black !important;
}

And Save.

Result:

Made4uoRibe_0-1725221910670.png
Made4uoRibe_0-1725221910670.png339Ă—237 8.42 KB

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

1 Like
10

Thanks a lot @Made4uo-Ribe i just changes word black to white and its changed,and for cart to show the numbers can you help me

11

I already checked it, but it can’t be changed with simple CSS. It seems to conflict with the JavaScript.