Make collection list carousel image smaller

Make collection list carousel image smaller

In collection-list.liquid, add the followings:

{

"type": "select",

"id": "mobile_columns",

"label": "t:settings.mobile_columns",

"options": [
{

"value": "1",

"label": "t:options.one_number"
},
{

"value": "2",

"label": "t:options.two_number"
},
Idea
{

"value": "3",

"label": "3"
},
{

"value": "4",

"label": "4"
}


{

"type": "select",

"id": "mobile_card_size",

"label": "t:settings.mobile_columns",

"options": [
{

"value": "60cqw",

"label": "t:options.one_number"
},
{

"value": "44cqw",

"label": "t:options.two_number"
},
Idea
{

"value": "33cqw",

"label": "3"
},
{

"value": "25cqw",

"label": "4"
}

    • Related Articles

    • Make collection list carousel/grid not show when there isn't any collection is chosen

      In base.css, add the following in the end of the file /* These are sections with placeholders that we don't want to have appear on the storefront when empty */ .shopify-section:has(.in-onboarding-state) { /* stylelint-disable-next-line ...

    • How to make image-with-text image smaller

      In the custom css of the section, add in: .image-with-text .image-with-text__media-item.image-with-text__media-item--small img { height: 70%; width: 70%; margin: 15%; }

    • Hide collection card with 0 product in collection list

      In collectionlist.liquid, add {% capture list_items %} {% for collection in section_collections limit: max_items %} {% if collection.products_count > 0 %} <div class="resource-list__item"> {% content_for 'block', type: '_collection-card', id: ...

    • Hide collection with 0 products in mega menu list

      In mega-menu-list.liquid, add the followings: {% for childLink in link.links %} {% if childLink.object.products_count > 0 %} {% assign break_after_modulo = forloop.index | modulo: links_before_wrap %} <li {% if break_after_modulo == 0 and ...

    • Video carousel with product link

      {% doc %} @prompt I want a video carousel block with the followings: - unlimited videos, preferably adding thru the section - product thumbnail with product link, when click it goes to product page - desktop column: 3,4,5 - mobile column: 1,2 - ...