Shopify themes, liquid, logos, and UX
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
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
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 -%}
<style>
.slideshow__text-wrapper { display: none !important; }
</style>
<a style="opacity: 0; z-index: 3;"
{% if block.settings.link %}
href="{{ block.settings.link }}"
{% else %}
role="link" aria-disabled="true"
{% endif %}
class="button {% if block.settings.button_style_secondary %}button--secondary{% else %}button--primary{% endif %}"
>
{{- block.settings.button_label | escape -}}
</a>
{%- endif -%}
- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.
Thank you for you help, but it doesnt work. Did a paste the code right ?
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
Discover how to increase customer engagement on your store with articles from Shopify A...
By Jacqui Apr 23, 2025Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025