Solved

How to make slideshow clickable - Spotlight Theme 14.0

topspotcards
Excursionist
32 1 12

How to make slideshow clickable - Spotlight Theme 14.0? Website: topspot.cards

 

I'm switching over from Dawn to Spotlight and I have changed the slideshow in Dawn to make the banner clickable but don't know how to add the right code to Spotlight. Help would be greatly appreciated. Thank you!

Accepted Solution (1)

BSSTech-Venture
Shopify Expert
400 98 108

This is an accepted solution.

Hi @topspotcards ,

 

Please follow these steps:

 

1. Please navigate to Online store => Themes => Edit code

 

2. In "slideshow.liquid" file, find "slideshow__text-wrapper" and add the following code

 

<a href="{{ block.settings.image_link }}" style="display: block;position: absolute;width: 100%;height: 100%;left: 0;top: 0;z-index: 999;"></a>

 

 

 view (12).png

 

Find "type": "image_picker", and add the following code below and hit Save

 

{
  "type": "url",
  "id": "image_link",
  "label": "image link"
},

 

view (13).png

 

In customize, you can now add image links to the slider

view (14).png

 

Hope this will help

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development

View solution in original post

Replies 2 (2)

BSSTech-Venture
Shopify Expert
400 98 108

This is an accepted solution.

Hi @topspotcards ,

 

Please follow these steps:

 

1. Please navigate to Online store => Themes => Edit code

 

2. In "slideshow.liquid" file, find "slideshow__text-wrapper" and add the following code

 

<a href="{{ block.settings.image_link }}" style="display: block;position: absolute;width: 100%;height: 100%;left: 0;top: 0;z-index: 999;"></a>

 

 

 view (12).png

 

Find "type": "image_picker", and add the following code below and hit Save

 

{
  "type": "url",
  "id": "image_link",
  "label": "image link"
},

 

view (13).png

 

In customize, you can now add image links to the slider

view (14).png

 

Hope this will help

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development

topspotcards
Excursionist
32 1 12

Thank you so so much. It was really easy to implement and understand. Have a blessed day!