How can I remove a repeating photo from my Craft Theme Slideshow?

Store Design
, , ,
1

Hi All

I’ve got a bit of an issue. I can’t seem to work out how to remove the photo in the middle of the slideshow. Each slide has the same photo which is the site background image.

Any clues / ideas on how to remove it I would be grateful for.

I have added how I have each photo configured in the slideshow.

Capture1.JPG
Capture1.JPG273×825 23.9 KB

Capture2.JPG
Capture2.JPG281×791 27.8 KB

Capture.JPG
Capture.JPG1868×851 134 KB

2

Hey @Careys ,

Can I have the link to your store?

3

Hi

The store isn’t live at the moment as it is still in development as we are working through text and images etc with the client.

4

Hey @Careys

You can share the preview link.

5

Preview Link.

Carey’s Joinery – Carey’s Joinery (careysjoinery.co.nz)

6

@ThePrimeWeb - Have you had any luck viewing the website via the Preview link? If not, please let me know how to contact you directly and I’ll send additional details.

7

Hey @Careys ,

Sorry flooded notifications. The store is password protected. Could you share the password or just disable it until I check the issue?

8

@ThePrimeWeb - Password to site now removed. :slightly_smiling_face:

9

Hey @Careys ,

I see you added this code in the base.css file

.gradient {
  background: var(--gradient-background);
  background-attachment: fixed;
  background-image: url(https://cdn.shopify.com/s/files/1/0847/1445/5351/files/IMG_1817.jpg?v=1701642808) !important;
  background-color: transparent !important;
  background-position: center !important;
  background-color: #000000 !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}

You should change the selector from .gradient to .gradient:not(.slideshow__text)

Final code should look like,

Note: Everything within the curly braces {} are the same

.gradient:not(.slideshow__text) {
  background: var(--gradient-background);
  background-attachment: fixed;
  background-image: url(https://cdn.shopify.com/s/files/1/0847/1445/5351/files/IMG_1817.jpg?v=1701642808) !important;
  background-color: transparent !important;
  background-position: center !important;
  background-color: #000000 !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}
10

@ThePrimeWeb

Thanks for the help. Fix worked.