Solved

Change background color of button from Collection list - Refresh Theme

Edgard22
Excursionist
42 3 3

Hi

 

I am sorry for my bad English (i am French)

 

I would like (on this website : https://f01138-5e.myshopify.com/) to change the "buttons" of my collection list (homepage)

 

I would like them to look like my other buttons on this website (Gold background)

 

Could you please Help Me ?

 

Thanks a lot ! 

 

Theme : refresh

Accepted Solution (1)

Dan-From-Ryviu
Shopify Partner
7726 1506 1515

This is an accepted solution.

Hi @Edgard22 

Please go to Online Store > Themes > Edit code > open theme.liquid file, add this code below after <head> 

 

<style>
.collection-list .card__heading .full-unstyled-link {
    display: inline-flex;
    background-color: rgba(var(--color-button), var(--alpha-button-background));
    padding: 1rem 2rem;
    border-radius: var(--buttons-radius);
}
</style>

Screenshot 2024-04-25 at 16.11.46.png

 

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 4 (4)

zack_dev
Shopify Partner
75 14 10
<style>
h3.card__heading {
    background: 0 0 0 calc(var(--buttons-border-width) + var(--border-offset)) rgba(var(--color-button-text),var(--border-opacity)),0 0 0 var(--buttons-border-width) rgba(var(--color-button),var(--alpha-button-background));
    box-shadow: 0 0 0 calc(var(--buttons-border-width) + var(--border-offset)) rgba(var(--color-button-text),var(--border-opacity)),0 0 0 var(--buttons-border-width) rgba(var(--color-button),var(--alpha-button-background));
    background: rgba(184,153,89);
    color: black;
    border-radius: 12px;
    padding: 10px;
}
</style>

hi you can place this code at bottom of theme.liquid .



- Helpful? Like or Accept solution, - Buy me Coffee


-

Contact me

Edgard22
Excursionist
42 3 3

Thanks a lot ! It works 

 

Very helpful 🙂 

Dan-From-Ryviu
Shopify Partner
7726 1506 1515

This is an accepted solution.

Hi @Edgard22 

Please go to Online Store > Themes > Edit code > open theme.liquid file, add this code below after <head> 

 

<style>
.collection-list .card__heading .full-unstyled-link {
    display: inline-flex;
    background-color: rgba(var(--color-button), var(--alpha-button-background));
    padding: 1rem 2rem;
    border-radius: var(--buttons-radius);
}
</style>

Screenshot 2024-04-25 at 16.11.46.png

 

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

Edgard22
Excursionist
42 3 3

HI ! 

 

Thanks a lot it works 🙂