how to code to remove the extra white space under slideshow

Store Design
, ,

Topic summary

Main issue: In the Taste theme slideshow, extra white space appears at the bottom on mobile. The user also wants slideshow images to be clickable without a button and preferably open in a new tab.

Guidance: Multiple replies share tutorials for making Dawn theme slideshow images clickable, noting Taste uses the same slideshow as Dawn. One suggestion clarifies the image click relies on adding a button link even if the button is hidden.

Progress: The user implemented a clickable slideshow and provided store URL (the828mart.com) and password (9988). They report CSS added to base.css didn’t work initially and ask how to open links in a new page and remove mobile white space.

Solution provided: A support rep shared steps to add Custom CSS via Theme settings and supplied a media query to hide the slideshow text wrapper on screens ≤750px, which should remove the extra mobile white space:
@media screen and (max-width: 750px){ .slideshow__text-wrapper.banner__content { display: none !important; } }

Status: Clickable image achieved. Mobile whitespace fix proposed via CSS and awaiting confirmation. Opening links in a new tab/new page remains unanswered.

Summarized with AI on December 12. AI used: gpt-5.
1

Im using Taste theme and added a slideshow. I put the heading size to be small. but on the mobile display, there are extra space at the bottom. how can i remove it from the mobile display?

2nd question, is there a way to make the pictures from the slideshow clickable as a link? I dont want to add a button. I’ll like the viewer to click on the image and i can add the link to the page.

2

Hi @bb04

You can follow this instruction to make slideshow image clickable

https://buymeacoffee.com/dandong910/making-a-slideshow-image-clickable-in-dawn-theme

3

@bb04 – can you please share your website link?

4

Hi @bb04 ,

You can follow the instructions below, it will work fine

5

Hi, is there one for the taste theme?

6

Hi, the Taste theme uses the same slideshow as Dawn’s one.

7

Hi @bb04

Could you please share with me your store link and entry password then we can check it further and provide you with a suitable customization code?

Looking forward to hearing from you soon. Thank you!

Best,

Daisy - Avada Support Team.

8

Hello, i did put a link and left the button empty (since i dont want the button there). i also added the css at the bottom of the base.css but its not working.

InTea Bubble Tea Flavors (51).png
InTea Bubble Tea Flavors (51).png1080×1080 128 KB

9

Hi @bb04 ,

You have tried this it will work fine

10

Hi I got the slide show to be clickable. but can it open to a new page? and also if the extra white space on the mobile view can be removed. Its the828mart.com and the password is 9988

11

My code will hide the button, so please add a link for the button so that the image can be clicked to open the link to that button.

12

Hi I got the slide show to be clickable. but can it open to a new page? and also if the extra white space on the “mobile view” can be removed. Its the828mart.com and the password is 9988

13

Hi @bb04

I hope you are well. You can follow our instructions below:

Step 1: Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
Step 2: From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
Step 3: Copy the code below and paste it there

Here is the code for Step 3:

@media screen and (max-width: 750px){
.slideshow__text-wrapper.banner__content {
    display: none !important;
}
}

image (25).png
image (25).png342×497 115 KB

Please let me know if it works. Thank you!

Best,
Daisy - Avada Support Team.