How can I reposition slider arrows on a collection list picture?

Store Design
, ,
1

Hello,

We want to move the arrows for the slider on the collection list, so that they are on the picture instead of under. Preferably in the middle of the picture. (See picture of how it looks now) Can someone please help us?

IMG_7371.jpg
IMG_7371.jpg1170×2202 64 KB

2

Hi @hug1

Can you give me your page URL (with pass if your store password is enabled), so I can check it and maybe give you a solution?

Kind & Best regards,
GemPages Support Team

3

Hi [email removed]Hug1,

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search component-slider.css

Step 3: Paste the below code at bottom of the file → Save

@media(max-width:767px){
.slider-buttons{
        position:absolute;
        left:0;
        right:0;
        top:45%;
        z-index:999
    }
    .slider-button .icon{
        height:1rem !important
    }
}

Hope my solution works perfectly for you!

Best regards,

Victor | PageFly

4

Thank you, it worked! How ever, how can I remove the arrow to the left/right when it is disabled? (for example when it is the first or last image in the slider)

5

Hi again! Do you have any suggestion on how to remove the arrow to the left/right when it is disabled? (for example when it is the first or last image in the slider)

Thank you in advance!