Hi all,
I'm trying to make my slideshow images clickable without a button. I'm using the Venture Theme and tried to look for a solution but all I could find were solutions for other themes and codes that I can't find on my files. Does anyone have any info on how to do that?
Thanks a lot,
Albert
Hello AlbertCollado,
Open file
Online Store-> Themes -> Edit code->Sections->slideshow.liquid
Search this code:
<div class="hero__image-content"> {%- if block.settings.image != blank -%} <noscript> <div class="hero__image hero__image--{{ block.id }}"{% if block.settings.image %} style="background-image: url('{{ block.settings.image | img_url: '2048x' }}');"{% endif %}></div> </noscript> {% assign img_url = block.settings.image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %} <img class="hero__image hero__image--{{ block.id }} lazyload {% unless forloop.first == true %} lazypreload{% endunless %}" {% if forloop.first == true %} src="{{ block.settings.image | img_url: '300x' }}" {% endif %} data-src="{{ img_url }}" data-widths="[540, 720, 900, 1080, 1296, 1512, 1728, 1944, 2048, 4472]" data-aspectratio="{{ block.settings.image.aspect_ratio }}" data-sizes="auto" data-parent-fit="cover" alt="{{ block.settings.image.alt | escape }}" style="object-position: {{ block.settings.image_position }}"> {%- else -%} {%- if block.settings.image == blank -%} <div class="placeholder-background"> {% capture current %}{% cycle 1, 2 %}{% endcapture %} {{ 'lifestyle-' | append: current | placeholder_svg_tag: 'placeholder-svg' }} </div> {%- endif -%} {%- endif -%} </div>
Replace this code with below code:
<a href="www.google.com"> <div class="hero__image-content"> {%- if block.settings.image != blank -%} <noscript> <div class="hero__image hero__image--{{ block.id }}"{% if block.settings.image %} style="background-image: url('{{ block.settings.image | img_url: '2048x' }}');"{% endif %}></div> </noscript> {% assign img_url = block.settings.image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %} <img class="hero__image hero__image--{{ block.id }} lazyload {% unless forloop.first == true %} lazypreload{% endunless %}" {% if forloop.first == true %} src="{{ block.settings.image | img_url: '300x' }}" {% endif %} data-src="{{ img_url }}" data-widths="[540, 720, 900, 1080, 1296, 1512, 1728, 1944, 2048, 4472]" data-aspectratio="{{ block.settings.image.aspect_ratio }}" data-sizes="auto" data-parent-fit="cover" alt="{{ block.settings.image.alt | escape }}" style="object-position: {{ block.settings.image_position }}"> {%- else -%} {%- if block.settings.image == blank -%} <div class="placeholder-background"> {% capture current %}{% cycle 1, 2 %}{% endcapture %} {{ 'lifestyle-' | append: current | placeholder_svg_tag: 'placeholder-svg' }} </div> {%- endif -%} {%- endif -%} </div> </a>
Hello AlbertCollado,
You need do more customization to change different url for different images.
@oscprofessionalAny ideas how to customise the code to link the different images to different links?
Thanks,
Albert
Subject | Author | Latest Post |
---|---|---|
Subject | Author | Posted |
---|---|---|
20m ago | ||
24m ago | ||
31m ago | ||
50m ago | ||
an hour ago |