On highlight theme, tried to add Link to entire Slider using following code:
However there is an issue now, it only shows 1 slider, all other sliders are hidden
1 Like
Here is the code I used:
{% if block.settings.image_link != blank %}
{% endif %}
{
“type”: “url”,
“id”: “image_link”,
“label”: “Image Link”
},
yes current this ways can you send store url so i will check frontend
Hi @RyanCheong1995 ,
Can you send me all the code of slideshow.liquid file. I will check it
Hey @KetanKumar here you go https://l1vin.com/
Hi @LitExtension here you go: https://l1vin.myshopify.com/admin
{%- liquid
assign section_color = section.settings.color_scheme
assign heading_size_class = section.settings.heading_size
-%}
{% render 'icon-pause' %}
{% render 'icon-play' %}
{% for block in section.blocks %}
{%- liquid
assign height = section.settings.height
unless forloop.first
assign height = ‘full_height’
endunless
assign image_focal_point = block.settings.image_focal_point
assign content_position = block.settings.content_position
assign content_width_desktop = block.settings.content_width_desktop
assign text_color = block.settings.text_color
assign background = block.settings.section_coolor
assign image = block.settings.image
assign image_mobile = block.settings.image_mobile
assign indent_image = block.settings.indent_image
assign title = block.settings.title
assign text = block.settings.text
assign cta_link = block.settings.cta_link
assign cta_text = block.settings.cta_text
assign cta_style = block.settings.cta_style
-%}
{{ 'sections.slideshow.previous_slide' | t }}
{% render 'icon-previous' %}
{{ 'sections.slideshow.next_slide' | t }}
{% render 'icon-next' %}
{% schema %}
{
“name”: “Slideshow”,
“class”: “has-full-screen-setting”,
“max_blocks”: 5,
“settings”: [
{
“type”: “select”,
“id”: “color_scheme”,
“label”: “Color scheme”,
“options”: [
{ “value”: “primary”, “label”: “Primary”},
{ “value”: “secondary”, “label”: “Secondary”},
{ “value”: “tertiary”, “label”: “Tertiary”}
],
“default”: “primary”
},
{
“type”: “select”,
“id”: “height”,
“label”: “Height”,
“options”: [
{ “value”: “natural”, “label”: “Adapt to first slide”},
{ “value”: “full_screen”, “label”: “Full screen”}
],
“default”: “natural”
},
{
“type”: “select”,
“id”: “heading_size”,
“label”: “Heading size”,
“options”: [
{ “value”: “text-sm”, “label”: “S”},
{ “value”: “text-base”, “label”: “M”},
{ “value”: “text-lg”, “label”: “L”},
{ “value”: “text-xl”, “label”: “XL”},
{ “value”: “text-2xl”, “label”: “2XL”},
{ “value”: “text-2xl lg:text-3xl”, “label”: “2XL / desktop 3XL”},
{ “value”: “text-2xl lg:text-4xl”, “label”: “2XL / desktop 4XL”},
{ “value”: “text-2xl lg:text-5xl”, “label”: “2XL / desktop 5XL” },
{ “value”: “text-2xl lg:text-6xl”, “label”: “2XL / desktop 6XL” },
{ “value”: “text-2xl lg:text-7xl”, “label”: “2XL / desktop 7XL” }
],
“default”: “text-2xl lg:text-5xl”
},
{
“type”: “checkbox”,
“id”: “auto_rotate”,
“label”: “Auto-rotate slides”,
“info”: “This will show a play and pause button and disable dragging.”
},
{
“type”: “select”,
“id”: “slide_speed”,
“label”: “Change slides every”,
“options”: [
{
“value”: “5000”,
“label”: “5 Seconds”
},
{
“value”: “6000”,
“label”: “6 Seconds”
},
{
“value”: “7000”,
“label”: “7 Seconds”
},
{
“value”: “8000”,
“label”: “8 Seconds”
},
{
“value”: “9000”,
“label”: “9 Seconds”
},
{
“value”: “10000”,
“label”: “10 Seconds”
}
]
}
],
“blocks”: [
{
“type”: “slide”,
“name”: “Slide”,
“settings”: [
{
“id”: “image”,
“type”: “image_picker”,
“label”: “Image”,
“info”: “1800 x 800px .jpg recommended”
},
{
“id”: “image_mobile”,
“type”: “image_picker”,
“label”: “Image - mobile”,
“info”: “800 x 1200px .jpg recommended”
},
{
“type”: “url”,
“id”: “image_link”,
“label”: “Image Link”
},
{
“type”: “checkbox”,
“id”: “indent_image”,
“label”: “Indent image”,
“default”: false
},
{
“type”: “select”,
“id”: “image_focal_point”,
“label”: “Image focal point”,
“options”: [
{ “value”: “object-left-top”, “label”: “Top left”},
{ “value”: “object-top”, “label”: “Top center”},
{ “value”: “object-right-top”, “label”: “Top right”},
{ “value”: “object-left”, “label”: “Left”},
{ “value”: “object-center”, “label”: “Center”},
{ “value”: “object-right”, “label”: “Right”},
{ “value”: “object-left-bottom”, “label”: “Bottom left”},
{ “value”: “object-bottom”, “label”: “Bottom center”},
{ “value”: “object-right-bottom”, “label”: “Bottom right”}
],
“default”: “object-center”,
“info”: “Only applies when image is cropped. Keeps image subject in view.”
},
{
“type”: “header”,
“content”: “Content”
},
{
“type”: “text”,
“id”: “title”,
“label”: “Heading”,
“default”: “Image slide”
},
{
“type”: “richtext”,
“id”: “text”,
“label”: “Text”
},
{
“type”: “select”,
“id”: “content_position”,
“label”: “Content position”,
“options”: [
{ “value”: “justify-start items-start text-left”, “label”: “Top left”},
{ “value”: “justify-center items-start text-center”, “label”: “Top center”},
{ “value”: “justify-end items-start text-right”, “label”: “Top right”},
{ “value”: “justify-start items-center text-left”, “label”: “Left”},
{ “value”: “justify-center items-center text-center”, “label”: “Center”},
{ “value”: “justify-end items-center text-right”, “label”: “Right”},
{ “value”: “justify-start items-end text-left”, “label”: “Bottom left”},
{ “value”: “justify-center items-end text-center”, “label”: “Bottom center”},
{ “value”: “justify-end items-end text-right”, “label”: “Bottom right”}
],
“default”: “justify-center items-center text-center”
},
{
“type”: “select”,
“id”: “content_width_desktop”,
“label”: “Content width on desktop”,
“default”: “lg:w-2/3”,
“options”: [
{
“value”: “lg:w-1/3”,
“label”: “One third”
},
{
“value”: “lg:w-1/2”,
“label”: “One half”
},
{
“value”: “lg:w-2/3”,
“label”: “Two thirds”
},
{
“value”: “lg:w-full”,
“label”: “Full width”
}
]
},
{
“type”: “select”,
“id”: “text_color”,
“label”: “Text color”,
“options”: [
{ “value”: “primary”, “label”: “Primary”},
{ “value”: “secondary”, “label”: “Secondary”},
{ “value”: “tertiary”, “label”: “Tertiary”},
{ “value”: “white”, “label”: “White”},
{ “value”: “black”, “label”: “Black”}
],
“default”: “primary”
},
{
“type”: “header”,
“content”: “Call to action”
},
{
“type”: “url”,
“id”: “cta_link”,
“label”: “Link”
},
{
“type”: “text”,
“id”: “cta_text”,
“label”: “Text”
},
{
“type”: “select”,
“id”: “cta_style”,
“label”: “Style”,
“options”: [
{ “value”: “link”, “label”: “Link”},
{ “value”: “button”, “label”: “Button”}
],
“default”: “link”
}
]
}
],
“presets”: [
{
“name”: “Slideshow”,
“blocks”: [
{
“type”: “slide”
},
{
“type”: “slide”
},
{
“type”: “slide”
}
]
}
]
}
{% endschema %}
1 Like
i can see its work your code
Hi @KetanKumar yes it works, but now there is an issue, the slider banner is not showing more than 1 sliders. I have actually added 2 slider visuals, but only 1 is being shown.
Hi @RyanCheong1995 ,
Please change all code:
{%- liquid
assign section_color = section.settings.color_scheme
assign heading_size_class = section.settings.heading_size
-%}
{% schema %}
{
"name": "Slideshow",
"class": "has-full-screen-setting",
"max_blocks": 5,
"settings": [
{
"type": "select",
"id": "color_scheme",
"label": "Color scheme",
"options": [
{ "value": "primary", "label": "Primary"},
{ "value": "secondary", "label": "Secondary"},
{ "value": "tertiary", "label": "Tertiary"}
],
"default": "primary"
},
{
"type": "select",
"id": "height",
"label": "Height",
"options": [
{ "value": "natural", "label": "Adapt to first slide"},
{ "value": "full_screen", "label": "Full screen"}
],
"default": "natural"
},
{
"type": "select",
"id": "heading_size",
"label": "Heading size",
"options": [
{ "value": "text-sm", "label": "S"},
{ "value": "text-base", "label": "M"},
{ "value": "text-lg", "label": "L"},
{ "value": "text-xl", "label": "XL"},
{ "value": "text-2xl", "label": "2XL"},
{ "value": "text-2xl lg:text-3xl", "label": "2XL / desktop 3XL"},
{ "value": "text-2xl lg:text-4xl", "label": "2XL / desktop 4XL"},
{ "value": "text-2xl lg:text-5xl", "label": "2XL / desktop 5XL" },
{ "value": "text-2xl lg:text-6xl", "label": "2XL / desktop 6XL" },
{ "value": "text-2xl lg:text-7xl", "label": "2XL / desktop 7XL" }
],
"default": "text-2xl lg:text-5xl"
},
{
"type": "checkbox",
"id": "auto_rotate",
"label": "Auto-rotate slides",
"info": "This will show a play and pause button and disable dragging."
},
{
"type": "select",
"id": "slide_speed",
"label": "Change slides every",
"options": [
{
"value": "5000",
"label": "5 Seconds"
},
{
"value": "6000",
"label": "6 Seconds"
},
{
"value": "7000",
"label": "7 Seconds"
},
{
"value": "8000",
"label": "8 Seconds"
},
{
"value": "9000",
"label": "9 Seconds"
},
{
"value": "10000",
"label": "10 Seconds"
}
]
}
],
"blocks": [
{
"type": "slide",
"name": "Slide",
"settings": [
{
"id": "image",
"type": "image_picker",
"label": "Image",
"info": "1800 x 800px .jpg recommended"
},
{
"id": "image_mobile",
"type": "image_picker",
"label": "Image - mobile",
"info": "800 x 1200px .jpg recommended"
},
{
"type": "url",
"id": "image_link",
"label": "Image Link"
},
{
"type": "checkbox",
"id": "indent_image",
"label": "Indent image",
"default": false
},
{
"type": "select",
"id": "image_focal_point",
"label": "Image focal point",
"options": [
{ "value": "object-left-top", "label": "Top left"},
{ "value": "object-top", "label": "Top center"},
{ "value": "object-right-top", "label": "Top right"},
{ "value": "object-left", "label": "Left"},
{ "value": "object-center", "label": "Center"},
{ "value": "object-right", "label": "Right"},
{ "value": "object-left-bottom", "label": "Bottom left"},
{ "value": "object-bottom", "label": "Bottom center"},
{ "value": "object-right-bottom", "label": "Bottom right"}
],
"default": "object-center",
"info": "Only applies when image is cropped. Keeps image subject in view."
},
{
"type": "header",
"content": "Content"
},
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "Image slide"
},
{
"type": "richtext",
"id": "text",
"label": "Text"
},
{
"type": "select",
"id": "content_position",
"label": "Content position",
"options": [
{ "value": "justify-start items-start text-left", "label": "Top left"},
{ "value": "justify-center items-start text-center", "label": "Top center"},
{ "value": "justify-end items-start text-right", "label": "Top right"},
{ "value": "justify-start items-center text-left", "label": "Left"},
{ "value": "justify-center items-center text-center", "label": "Center"},
{ "value": "justify-end items-center text-right", "label": "Right"},
{ "value": "justify-start items-end text-left", "label": "Bottom left"},
{ "value": "justify-center items-end text-center", "label": "Bottom center"},
{ "value": "justify-end items-end text-right", "label": "Bottom right"}
],
"default": "justify-center items-center text-center"
},
{
"type": "select",
"id": "content_width_desktop",
"label": "Content width on desktop",
"default": "lg:w-2/3",
"options": [
{
"value": "lg:w-1/3",
"label": "One third"
},
{
"value": "lg:w-1/2",
"label": "One half"
},
{
"value": "lg:w-2/3",
"label": "Two thirds"
},
{
"value": "lg:w-full",
"label": "Full width"
}
]
},
{
"type": "select",
"id": "text_color",
"label": "Text color",
"options": [
{ "value": "primary", "label": "Primary"},
{ "value": "secondary", "label": "Secondary"},
{ "value": "tertiary", "label": "Tertiary"},
{ "value": "white", "label": "White"},
{ "value": "black", "label": "Black"}
],
"default": "primary"
},
{
"type": "header",
"content": "Call to action"
},
{
"type": "url",
"id": "cta_link",
"label": "Link"
},
{
"type": "text",
"id": "cta_text",
"label": "Text"
},
{
"type": "select",
"id": "cta_style",
"label": "Style",
"options": [
{ "value": "link", "label": "Link"},
{ "value": "button", "label": "Button"}
],
"default": "link"
}
]
}
],
"presets": [
{
"name": "Slideshow",
"blocks": [
{
"type": "slide"
},
{
"type": "slide"
},
{
"type": "slide"
}
]
}
]
}
{% endschema %}
Hope it helps!
Hi @LitExtension thanks for the code, unfortunately it did not work when I pasted the entire code in to replace slideshow.liquid, the issue persists in which it does not show other sliders that I have added, only the first slider is shown.
However the link now applies to whole banner. Not sure if there is a solution to the issue above.
Hi @RyanCheong1995 ,
Can you try returning the code to the original version and try again? Ex:
Hope it helps!
Hi @LitExtension yes same issue, restoring the code to original, then reapplying your code did not work.
Hi @RyanCheong1995 ,
First, you go back to the original code and check if it works fine.
Then, if it works fine, please send me the code, I will help you to add the code to click the image.
Hope it is clear to you.
Hi @LitExtension yes I can confirm the original code works fine, it allows slideshow of multiple visuals, just that the link is not entire image, you can use the code below and hope it helps!
{%- liquid
assign section_color = section.settings.color_scheme
assign heading_size_class = section.settings.heading_size
-%}
{% render 'icon-pause' %}
{% render 'icon-play' %}
{% for block in section.blocks %}
{%- liquid
assign height = section.settings.height
unless forloop.first
assign height = 'full_height'
endunless
assign image_focal_point = block.settings.image_focal_point
assign content_position = block.settings.content_position
assign content_width_desktop = block.settings.content_width_desktop
assign text_color = block.settings.text_color
assign background = block.settings.section_coolor
assign image = block.settings.image
assign image_mobile = block.settings.image_mobile
assign indent_image = block.settings.indent_image
assign title = block.settings.title
assign text = block.settings.text
assign cta_link = block.settings.cta_link
assign cta_text = block.settings.cta_text
assign cta_style = block.settings.cta_style
-%}
{%- render 'image-with-text-overlay',
height: height,
image_focal_point: image_focal_point,
image: image,
image_mobile: image_mobile,
indent_image: indent_image,
content_position: content_position,
heading_size_class: heading_size_class,
text_color: text_color,
background: background,
content_width_desktop: content_width_desktop,
title: title,
text: text,
cta_link: cta_link,
cta_text: cta_text,
cta_style: cta_style,
responsive_image_counter: forloop.index
-%}
{% endfor %}
{{ 'sections.slideshow.previous_slide' | t }}
{% render 'icon-previous' %}
{{ 'sections.slideshow.next_slide' | t }}
{% render 'icon-next' %}
{% schema %}
{
“name”: “Slideshow”,
“class”: “has-full-screen-setting”,
“max_blocks”: 5,
“settings”: [
{
“type”: “select”,
“id”: “color_scheme”,
“label”: “Color scheme”,
“options”: [
{ “value”: “primary”, “label”: “Primary”},
{ “value”: “secondary”, “label”: “Secondary”},
{ “value”: “tertiary”, “label”: “Tertiary”}
],
“default”: “primary”
},
{
“type”: “select”,
“id”: “height”,
“label”: “Height”,
“options”: [
{ “value”: “natural”, “label”: “Adapt to first slide”},
{ “value”: “full_screen”, “label”: “Full screen”}
],
“default”: “natural”
},
{
“type”: “select”,
“id”: “heading_size”,
“label”: “Heading size”,
“options”: [
{ “value”: “text-sm”, “label”: “S”},
{ “value”: “text-base”, “label”: “M”},
{ “value”: “text-lg”, “label”: “L”},
{ “value”: “text-xl”, “label”: “XL”},
{ “value”: “text-2xl”, “label”: “2XL”},
{ “value”: “text-2xl lg:text-3xl”, “label”: “2XL / desktop 3XL”},
{ “value”: “text-2xl lg:text-4xl”, “label”: “2XL / desktop 4XL”},
{ “value”: “text-2xl lg:text-5xl”, “label”: “2XL / desktop 5XL” },
{ “value”: “text-2xl lg:text-6xl”, “label”: “2XL / desktop 6XL” },
{ “value”: “text-2xl lg:text-7xl”, “label”: “2XL / desktop 7XL” }
],
“default”: “text-2xl lg:text-5xl”
},
{
“type”: “checkbox”,
“id”: “auto_rotate”,
“label”: “Auto-rotate slides”,
“info”: “This will show a play and pause button and disable dragging.”
},
{
“type”: “select”,
“id”: “slide_speed”,
“label”: “Change slides every”,
“options”: [
{
“value”: “5000”,
“label”: “5 Seconds”
},
{
“value”: “6000”,
“label”: “6 Seconds”
},
{
“value”: “7000”,
“label”: “7 Seconds”
},
{
“value”: “8000”,
“label”: “8 Seconds”
},
{
“value”: “9000”,
“label”: “9 Seconds”
},
{
“value”: “10000”,
“label”: “10 Seconds”
}
]
}
],
“blocks”: [
{
“type”: “slide”,
“name”: “Slide”,
“settings”: [
{
“id”: “image”,
“type”: “image_picker”,
“label”: “Image”,
“info”: “1800 x 800px .jpg recommended”
},
{
“id”: “image_mobile”,
“type”: “image_picker”,
“label”: “Image - mobile”,
“info”: “800 x 1200px .jpg recommended”
},
{
“type”: “checkbox”,
“id”: “indent_image”,
“label”: “Indent image”,
“default”: false
},
{
“type”: “select”,
“id”: “image_focal_point”,
“label”: “Image focal point”,
“options”: [
{ “value”: “object-left-top”, “label”: “Top left”},
{ “value”: “object-top”, “label”: “Top center”},
{ “value”: “object-right-top”, “label”: “Top right”},
{ “value”: “object-left”, “label”: “Left”},
{ “value”: “object-center”, “label”: “Center”},
{ “value”: “object-right”, “label”: “Right”},
{ “value”: “object-left-bottom”, “label”: “Bottom left”},
{ “value”: “object-bottom”, “label”: “Bottom center”},
{ “value”: “object-right-bottom”, “label”: “Bottom right”}
],
“default”: “object-center”,
“info”: “Only applies when image is cropped. Keeps image subject in view.”
},
{
“type”: “header”,
“content”: “Content”
},
{
“type”: “text”,
“id”: “title”,
“label”: “Heading”,
“default”: “Image slide”
},
{
“type”: “richtext”,
“id”: “text”,
“label”: “Text”
},
{
“type”: “select”,
“id”: “content_position”,
“label”: “Content position”,
“options”: [
{ “value”: “justify-start items-start text-left”, “label”: “Top left”},
{ “value”: “justify-center items-start text-center”, “label”: “Top center”},
{ “value”: “justify-end items-start text-right”, “label”: “Top right”},
{ “value”: “justify-start items-center text-left”, “label”: “Left”},
{ “value”: “justify-center items-center text-center”, “label”: “Center”},
{ “value”: “justify-end items-center text-right”, “label”: “Right”},
{ “value”: “justify-start items-end text-left”, “label”: “Bottom left”},
{ “value”: “justify-center items-end text-center”, “label”: “Bottom center”},
{ “value”: “justify-end items-end text-right”, “label”: “Bottom right”}
],
“default”: “justify-center items-center text-center”
},
{
“type”: “select”,
“id”: “content_width_desktop”,
“label”: “Content width on desktop”,
“default”: “lg:w-2/3”,
“options”: [
{
“value”: “lg:w-1/3”,
“label”: “One third”
},
{
“value”: “lg:w-1/2”,
“label”: “One half”
},
{
“value”: “lg:w-2/3”,
“label”: “Two thirds”
},
{
“value”: “lg:w-full”,
“label”: “Full width”
}
]
},
{
“type”: “select”,
“id”: “text_color”,
“label”: “Text color”,
“options”: [
{ “value”: “primary”, “label”: “Primary”},
{ “value”: “secondary”, “label”: “Secondary”},
{ “value”: “tertiary”, “label”: “Tertiary”},
{ “value”: “white”, “label”: “White”},
{ “value”: “black”, “label”: “Black”}
],
“default”: “primary”
},
{
“type”: “header”,
“content”: “Call to action”
},
{
“type”: “url”,
“id”: “cta_link”,
“label”: “Link”
},
{
“type”: “text”,
“id”: “cta_text”,
“label”: “Text”
},
{
“type”: “select”,
“id”: “cta_style”,
“label”: “Style”,
“options”: [
{ “value”: “link”, “label”: “Link”},
{ “value”: “button”, “label”: “Button”}
],
“default”: “link”
}
]
}
],
“presets”: [
{
“name”: “Slideshow”,
“blocks”: [
{
“type”: “slide”
},
{
“type”: “slide”
},
{
“type”: “slide”
}
]
}
]
}
{% endschema %}
Hi @RyanCheong1995 ,
Please change all code:
{%- liquid
assign section_color = section.settings.color_scheme
assign heading_size_class = section.settings.heading_size
-%}
{% schema %}
{
"name": "Slideshow",
"class": "has-full-screen-setting",
"max_blocks": 5,
"settings": [
{
"type": "select",
"id": "color_scheme",
"label": "Color scheme",
"options": [
{ "value": "primary", "label": "Primary"},
{ "value": "secondary", "label": "Secondary"},
{ "value": "tertiary", "label": "Tertiary"}
],
"default": "primary"
},
{
"type": "select",
"id": "height",
"label": "Height",
"options": [
{ "value": "natural", "label": "Adapt to first slide"},
{ "value": "full_screen", "label": "Full screen"}
],
"default": "natural"
},
{
"type": "select",
"id": "heading_size",
"label": "Heading size",
"options": [
{ "value": "text-sm", "label": "S"},
{ "value": "text-base", "label": "M"},
{ "value": "text-lg", "label": "L"},
{ "value": "text-xl", "label": "XL"},
{ "value": "text-2xl", "label": "2XL"},
{ "value": "text-2xl lg:text-3xl", "label": "2XL / desktop 3XL"},
{ "value": "text-2xl lg:text-4xl", "label": "2XL / desktop 4XL"},
{ "value": "text-2xl lg:text-5xl", "label": "2XL / desktop 5XL" },
{ "value": "text-2xl lg:text-6xl", "label": "2XL / desktop 6XL" },
{ "value": "text-2xl lg:text-7xl", "label": "2XL / desktop 7XL" }
],
"default": "text-2xl lg:text-5xl"
},
{
"type": "checkbox",
"id": "auto_rotate",
"label": "Auto-rotate slides",
"info": "This will show a play and pause button and disable dragging."
},
{
"type": "select",
"id": "slide_speed",
"label": "Change slides every",
"options": [
{
"value": "5000",
"label": "5 Seconds"
},
{
"value": "6000",
"label": "6 Seconds"
},
{
"value": "7000",
"label": "7 Seconds"
},
{
"value": "8000",
"label": "8 Seconds"
},
{
"value": "9000",
"label": "9 Seconds"
},
{
"value": "10000",
"label": "10 Seconds"
}
]
}
],
"blocks": [
{
"type": "slide",
"name": "Slide",
"settings": [
{
"id": "image",
"type": "image_picker",
"label": "Image",
"info": "1800 x 800px .jpg recommended"
},
{
"id": "image_mobile",
"type": "image_picker",
"label": "Image - mobile",
"info": "800 x 1200px .jpg recommended"
},
{
"type": "checkbox",
"id": "indent_image",
"label": "Indent image",
"default": false
},
{
"type": "select",
"id": "image_focal_point",
"label": "Image focal point",
"options": [
{ "value": "object-left-top", "label": "Top left"},
{ "value": "object-top", "label": "Top center"},
{ "value": "object-right-top", "label": "Top right"},
{ "value": "object-left", "label": "Left"},
{ "value": "object-center", "label": "Center"},
{ "value": "object-right", "label": "Right"},
{ "value": "object-left-bottom", "label": "Bottom left"},
{ "value": "object-bottom", "label": "Bottom center"},
{ "value": "object-right-bottom", "label": "Bottom right"}
],
"default": "object-center",
"info": "Only applies when image is cropped. Keeps image subject in view."
},
{
"type": "header",
"content": "Content"
},
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "Image slide"
},
{
"type": "richtext",
"id": "text",
"label": "Text"
},
{
"type": "select",
"id": "content_position",
"label": "Content position",
"options": [
{ "value": "justify-start items-start text-left", "label": "Top left"},
{ "value": "justify-center items-start text-center", "label": "Top center"},
{ "value": "justify-end items-start text-right", "label": "Top right"},
{ "value": "justify-start items-center text-left", "label": "Left"},
{ "value": "justify-center items-center text-center", "label": "Center"},
{ "value": "justify-end items-center text-right", "label": "Right"},
{ "value": "justify-start items-end text-left", "label": "Bottom left"},
{ "value": "justify-center items-end text-center", "label": "Bottom center"},
{ "value": "justify-end items-end text-right", "label": "Bottom right"}
],
"default": "justify-center items-center text-center"
},
{
"type": "select",
"id": "content_width_desktop",
"label": "Content width on desktop",
"default": "lg:w-2/3",
"options": [
{
"value": "lg:w-1/3",
"label": "One third"
},
{
"value": "lg:w-1/2",
"label": "One half"
},
{
"value": "lg:w-2/3",
"label": "Two thirds"
},
{
"value": "lg:w-full",
"label": "Full width"
}
]
},
{
"type": "select",
"id": "text_color",
"label": "Text color",
"options": [
{ "value": "primary", "label": "Primary"},
{ "value": "secondary", "label": "Secondary"},
{ "value": "tertiary", "label": "Tertiary"},
{ "value": "white", "label": "White"},
{ "value": "black", "label": "Black"}
],
"default": "primary"
},
{
"type": "header",
"content": "Call to action"
},
{
"type": "url",
"id": "cta_link",
"label": "Link"
},
{
"type": "text",
"id": "cta_text",
"label": "Text"
},
{
"type": "select",
"id": "cta_style",
"label": "Style",
"options": [
{ "value": "link", "label": "Link"},
{ "value": "button", "label": "Button"}
],
"default": "link"
}
]
}
],
"presets": [
{
"name": "Slideshow",
"blocks": [
{
"type": "slide"
},
{
"type": "slide"
},
{
"type": "slide"
}
]
}
]
}
{% endschema %}
Hope it helps!
Hey @LitExtension very nice! It now works as intended. Thanks alot
May I know the changes needed to the code in order for this function to work? As compared to previous code.
1 Like