Hello,
To quickly describe my problem i wonder how i can have a fourth icon with text inside the icon with text section on my product page.
my product page: https://r1vex.myshopify.com/products/emil-randig-strandstol-taupe
I’m trying to recreate a similar “icon with text” section on my product page to this one:
And currently mine looks like this:
The problem i have is not how to align the text right now but how to add another text with icon, because you can only have 3 by default.
I have tried changing the code inside “icon-with-text.liquid” to this but it didn’t work:
{% comment %}
Renders icon with text block
Accepts:
- block: {Object} passes in the block information.
Usage:
{% render 'icon-with-text',
block: block
%}
{% endcomment %}
{%- liquid
assign heading_1_empty = false
assign heading_2_empty = false
assign heading_3_empty = false
assign heading_4_empty = false
assign text_only_all_items = true
if block.settings.heading_1 == empty
assign heading_1_empty = true
endif
if block.settings.heading_2 == empty
assign heading_2_empty = true
endif
if block.settings.heading_3 == empty
assign heading_3_empty = true
endif
if block.settings.heading_4 == empty
assign heading_4_empty = true
endif
if heading_1_empty == false and block.settings.icon_1 != 'none' or block.settings.image_1 != null
assign text_only_all_items = false
elsif heading_2_empty == false and block.settings.icon_2 != 'none' or block.settings.image_2 != null
assign text_only_all_items = false
elsif heading_3_empty == false and block.settings.icon_3 != 'none' or block.settings.image_3 != null
assign text_only_all_items = false
elsif heading_4_empty == false and block.settings.icon_4 != 'none' or block.settings.image_4 != null
assign text_only_all_items = false
endif
-%}
{%- unless heading_1_empty -%}
- {%- if block.settings.image_1 == null -%}
{%- render 'icon-accordion', icon: block.settings.icon_1 -%}
{%- else -%}
{%- endif -%}
{{- block.settings.heading_1 -}}
{%- endunless -%}
{%- unless heading_2_empty -%}
- {%- if block.settings.image_2 == null -%}
{% render 'icon-accordion', icon: block.settings.icon_2 -%}
{%- else -%}
{%- endif -%}
{{- block.settings.heading_2 -}}
{%- endunless -%}
{%- unless heading_3_empty -%}
- {%- if block.settings.image_3 == null -%}
{% render 'icon-accordion', icon: block.settings.icon_3 -%}
{%- else -%}
{%- endif -%}
{{- block.settings.heading_3 -}}
{%- endunless -%}
{%- unless heading_4_empty -%}
- {%- if block.settings.image_4 == null -%}
{%- render 'icon-accordion', icon: block.settings.icon_4 -%}
{%- else -%}
{%- endif -%}
{{- block.settings.heading_4 -}}
{%- endunless -%}
Thanks for helping!
