All Collections
Banner Content
Enhancing Banner Container / Sliders
Enhancing Banner Container / Sliders

Modify how images will fit in single/double banners (stretch, center, etc)

Ricardo Santos avatar
Written by Ricardo Santos
Updated over a week ago

If you need to change the fill mode for a specific slider, for example when the images are too small but you still don't want them to stretch to the whole width of the widget, you can do so by adding a script like this to the footer block, you only need the widget id that can be found inspecting the HTML in the storefront.

<script>
MasterSliders.forEach(function (slider) {
if (slider.widget_id == 187359) {
slider.fillMode = 'center';
}
});
</script>

fillMode specifies the slide background scaling method. Its acceptable values are "fill", "fit", "stretch", "center" and "tile".

Default value used on our sliders is "fit"

Did this answer your question?