Re: How To Add Arrows In The Product Page Image Slider

How To Add Arrows In The Product Page Image Slider

Dnlgrs
Visitor
2 0 0

Hi, 

 

Is it possible to add arrows on the slider images of the product page? I'm using Refresh Theme. 

 

Something like in the picture below.
 
Thanks 

 

Screenshot 2022-11-14 at 11.05.17.png

 

Replies 7 (7)

AnhTien
Tourist
19 0 0

I think you go up to the code to edit.

EnvyTrendy
Tourist
4 0 0

Hello,

Were you able to figure out which part to place the code?

I'm stuck here as well, having the same issue.

Minakshi15
Shopify Partner
148 6 13

@EnvyTrendy which code are you using for slider ?

If you find my reply helpful, please hit Like and Mark as Solution

Minakshi15
Shopify Partner
148 6 13

@Dnlgrs Please use this js 

$(function(){
  $("#add your id/class here").slick({
    speed: 1000,
    dots: true,
    prevArrow: '<button class="slide-arrow prev-arrow"></button>',
    nextArrow: '<button class="slide-arrow next-arrow"></button>'
  });
});
If you find my reply helpful, please hit Like and Mark as Solution
Dnlgrs
Visitor
2 0 0

Where should I use this?

Minakshi15
Shopify Partner
148 6 13

In your Js file @Dnlgrs 

 

added this into you css 

.product__media-wrapper .slider-mobile-gutter .slider-button{

  display:flex !important;

}
If you find my reply helpful, please hit Like and Mark as Solution
stephenm1
New Member
4 0 0

where do i put the code ?