Hello,
I’ve gone through the fixes in other threads but not had any luck.
I want my collection list on mobile to be 3x1 and not 2x2 as I am only listing 3 collections and on mobile it shows an ugly white box.
I use the “Impulse” paid theme and my shop is - www.VLRSHOP.com
Thanks 
Do you want it like this 3xrows?
Or 1xrow?
If you want like in the screenshot and you are using the “Featured Collection” block on impulse you need to change the file featured-collection.liquid at around line 35 you need to replace small–one-half with small–one-third
assign grid_item_width = 'small--one-third medium-up--one-third'
I want it to stay the way it is on the website (3x1 - 3 on 1 row)
But on mobile I want it to be (1x3 - 1 on 3 rows)
If you want like in the screenshot and you are using the “Featured Collection” block on impulse you need to change the file featured-collection.liquid at around line 35 you need to replace small–one-half with small–one-whole
assign grid_item_width = 'small--one-whole medium-up--one-third'
Apologies I couldn’t see “small–one–half”. I have pasted my code from featured-collection.liquid if that helps:
{%- assign per_row = section.settings.per_row -%}
{%- assign product_limit = per_row | times: section.settings.rows -%}
{%- assign collection = collections[section.settings.home_featured_products] -%}
{%- if section.settings.divider -%}
if section.settings.mobile_scrollable
assign fallback = ‘39vw’
else
assign fallback = ‘variable’
endif
-%}
{%- if section.settings.home_featured_products == blank or collections[section.settings.home_featured_products].empty? or collections[section.settings.home_featured_products].products_count == 0 -%}
{%- unless emptyState -%}
{%- assign emptyState = true -%}
{%- endunless -%}
{%- else -%}
{%- for product in collections[section.settings.home_featured_products].products limit: product_limit -%}
{%- render ‘product-grid-item’,
product: product,
collection: collection,
per_row: per_row,
quick_shop_enable: settings.quick_shop_enable,
fallback: fallback,
-%}
{%- endfor -%}
{%- if section.settings.view_all -%}
{%- if section.settings.rows > 1 -%}
{%- endif -%}{%- if section.settings.mobile_scrollable -%}
{%- endif -%}{%- endif -%}
{%- endif -%}
{%- if section.settings.divider -%}{%- endif -%}
{% schema %}
{
“name”: “t:sections.featured-collection.name”,
“class”: “index-section”,
“settings”: [
{
“type”: “text”,
“id”: “title”,
“label”: “t:sections.featured-collection.settings.title.label”,
“default”: “Featured collection”
},
{
“type”: “collection”,
“id”: “home_featured_products”,
“label”: “t:sections.featured-collection.settings.home_featured_products.label”
},
{
“type”: “range”,
“id”: “per_row”,
“label”: “t:sections.featured-collection.settings.per_row.label”,
“default”: 4,
“min”: 1,
“max”: 5,
“step”: 1
},
{
“type”: “range”,
“id”: “rows”,
“label”: “t:sections.featured-collection.settings.rows.label”,
“default”: 1,
“min”: 1,
“max”: 5,
“step”: 1
},
{
“type”: “checkbox”,
“id”: “mobile_scrollable”,
“label”: “t:sections.featured-collection.settings.mobile_scrollable.label”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “view_all”,
“label”: “t:sections.featured-collection.settings.view_all.label”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “divider”,
“label”: “t:sections.featured-collection.settings.divider.label”,
“default”: false
}
],
“presets”: [
{
“name”: “t:sections.featured-collection.presets.featured_collection.name”
}
],
“blocks”: ,
“disabled_on”: {
“groups”: [“footer”, “header”, “custom.popups”]
}
}
{% endschema %}
I see.. my code is based on Impulse 7.1.0 probably you are using a different version.
You can specify which version but if it is older I don’t think I can help if I don’t have access to the previous versions.
I’m on 7.2!
Ok I see, they introduced some changes. I updated to the latest 7.3.4 and it is more similar to the code you shared.
Now I can suggest a solution but it could have side effects on other pages because the code is shared between different blocks.
You can try but make a backup first and work on a theme copy.
You need to modify the file products_per_row.liquid and change the code from this
if style == 'fractions'
case products_per_row
when 1
assign gridView = ''
when 2
assign gridView = 'medium-up--one-half'
when 3
assign gridView = 'small--one-half medium-up--one-third'
when 4
assign gridView = 'small--one-half medium-up--one-quarter'
when 5
assign gridView = 'small--one-half medium-up--one-fifth'
else
assign gridView = 'small--one-third medium-up--one-sixth'
endcase
endif
to this
if style == 'fractions'
case products_per_row
when 1
assign gridView = ''
when 2
assign gridView = 'medium-up--one-half'
when 3
assign gridView = 'small--one-whole medium-up--one-third'
when 4
assign gridView = 'small--one-half medium-up--one-quarter'
when 5
assign gridView = 'small--one-half medium-up--one-fifth'
else
assign gridView = 'small--one-third medium-up--one-sixth'
endcase
endif
