Slideshow Button and Image Banner Button

Store Design
, , ,
1

Hello Everybody!

I am changing my website a bit and got some toubles with my buttons on the slideshow and image banners..

I can change text color etc. but not the border of the button itself.. can someone help me with that please?

I would want it to be white!

I will put some screenshots in so it will be easier

thanks for the help!

Bildschirmfoto 2025-04-30 um 13.49.57.png
Bildschirmfoto 2025-04-30 um 13.49.57.png2686×1758 553 KB

Bildschirmfoto 2025-06-11 um 15.36.11.png
Bildschirmfoto 2025-06-11 um 15.36.11.png2526×1624 409 KB

Bildschirmfoto 2025-06-11 um 15.35.00.jpg
Bildschirmfoto 2025-06-11 um 15.35.00.jpg1914×897 149 KB

2

Hi @LeandroS ,

kindly provide your store URL please and if it is password protected, please share the password as well.

Thanks!

3

Hi @LeandroS

Can you please share the store password so I can provide the exact code for this?

4

www.gogghi.ch

password: DESERTPALM-SUMMERDUNES

5

www.gogghi.ch

password: DESERTPALM-SUMMERDUNES

6

Hi @LeandroS ,

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.css / based.css file and paste the code in the bottom of the file.
.banner__box .button--secondary:after {
    border: 1px solid black !important;
}

.banner__box .button:after, .shopify-challenge__button:after, .customer button:after, .shopify-payment-button__button--unbranded:after{
    box-shadow: 0 0 white !important;
    border: 1px solid black;
}
7

@LeandroS

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.css / based.css file and paste the code in the bottom of the file.
.banner__box .button--secondary:after {
    border: 1px solid black !important;
}

.banner__box .button:after, .shopify-challenge__button:after, .customer button:after, .shopify-payment-button__button--unbranded:after{
    box-shadow: 0 0 white !important;
    border: 1px solid black;
}
8

Try this code

Navigate to Online Store > Themes > click on Edit code.
Locate and open the theme.css or base.css file. Scroll to the bottom and add the following CSS code:

.button:after, .shopify-challenge__button:after, .customer button:after, .shopify-payment-button__button--unbranded::after {
    box-shadow: 0 0 0 calc(var(--buttons-border-width) + var(--border-offset)) #fff, 0 0 0 var(--buttons-border-width) #f8f8f8 !important;
}
9

perfect thanks for the help!