How to make slideshow draggable and clickable + design of controls

[radaApeta]

Hello,

i need help with two things, first one is - how to delete the small line that is over the controls. The second one how do i make the slideshow draggable and clickable. I was looking at other posts but nothing worked for me

thank you :))

https://81e325-28.myshopify.com/

0007

[aBox_Agency]

Hello @radaApeta

For the Border thing - attach a screenshot.

Go to component-slideshow.css
Class: slideshow__controls

You have great products with an extensive range - Please try something premium theme and develop on it.

Thank you

[aBox_Agency]

[Dan-From-Ryviu]

Hi @radaApeta

You can add this code to Custom CSS of that section to remove the line.

.slideshow__controls {
    border: unset !important;
}

To make image clickable, please go to Online Store > Themes > Edit code > open slideshow.liquid file, find this line of code

{%- if block.settings.image -%}

Add this code above it

{%- if block.settings.button_label != blank -%}
  
  
    {{- block.settings.button_label | escape -}}
  
{%- endif -%}

[Rahul_dhiman]

Hello @radaApeta - (1) how to delete the small line that is over the controls.

Go to online store ---------> themes --------------> actions ------> edit code------->assets-----> component-slideshow.css ----> line number 102
search this code

.slideshow__controls {
border: 0.1rem solid rgba(var(--color-foreground), 0.08);
}

and replace with this code.

.slideshow__controls {
border: 0rem solid rgba(var(--color-foreground),.08);
}

and the result will be

2. To make the Slideshow Clickable - this will need custom coding to make it clickable.
   and i can help you in this custom coding, let me know.

If this was helpful, hit the like button and mark the job as completed.
Thanks

[radaApeta]

Thank you for you help, but it doesnt work. Did a paste the code right ?