add multiple logos with links || multiple images with links
<div class="logo-bar-section container">
<div class="sixteen columns">
<div class="section clearfix">
{% if section.settings.title != blank %}
<h2 class="title center">
{{ section.settings.title | escape }}
</h2>
<div class="feature_divider"></div>
{% endif %}
{% if section.blocks.size > 0 %}
<div class="logo-bar">
{% for block in section.blocks %}
<div class="logo-bar__item" {{ block.shopify_attributes }}>
{% if block.settings.link != blank %}
<a href="{{ block.settings.link }}" class="logo-bar__link">
{% endif %}
{% if block.settings.image != blank %}
{{ block.settings.image | img_url: '160x160', scale: 2 | img_tag: block.settings.image.alt, 'logo-bar__image' }}
{% else %}
{{ 'logo' | placeholder_svg_tag: 'placeholder-svg' }}
{% endif %}
{% if block.settings.link != blank %}
</a>
{% endif %}
</div>
{% endfor %}
</div>
{% endif %}
</div>
</div>
</div>
{% schema %}
{
"name": "Logo list",
"class": "logo-list-section",
"max_blocks": 20,
"settings": [
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "Logo list"
}
],
"blocks": [
{
"type": "logo_image",
"name": "Logo",
"settings": [
{
"type": "image_picker",
"id": "image",
"label": "Image"
},
{
"type": "url",
"id": "link",
"label": "Link",
"info": "Optional"
}
]
}
],
"presets": [
{
"name": "Logo list",
"category": "Image",
"blocks": [
{
"type": "logo_image"
},
{
"type": "logo_image"
},
{
"type": "logo_image"
},
{
"type": "logo_image"
}
]
}
]
}
{% endschema %}
<div class="sixteen columns">
<div class="section clearfix">
{% if section.settings.title != blank %}
<h2 class="title center">
{{ section.settings.title | escape }}
</h2>
<div class="feature_divider"></div>
{% endif %}
{% if section.blocks.size > 0 %}
<div class="logo-bar">
{% for block in section.blocks %}
<div class="logo-bar__item" {{ block.shopify_attributes }}>
{% if block.settings.link != blank %}
<a href="{{ block.settings.link }}" class="logo-bar__link">
{% endif %}
{% if block.settings.image != blank %}
{{ block.settings.image | img_url: '160x160', scale: 2 | img_tag: block.settings.image.alt, 'logo-bar__image' }}
{% else %}
{{ 'logo' | placeholder_svg_tag: 'placeholder-svg' }}
{% endif %}
{% if block.settings.link != blank %}
</a>
{% endif %}
</div>
{% endfor %}
</div>
{% endif %}
</div>
</div>
</div>
{% schema %}
{
"name": "Logo list",
"class": "logo-list-section",
"max_blocks": 20,
"settings": [
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "Logo list"
}
],
"blocks": [
{
"type": "logo_image",
"name": "Logo",
"settings": [
{
"type": "image_picker",
"id": "image",
"label": "Image"
},
{
"type": "url",
"id": "link",
"label": "Link",
"info": "Optional"
}
]
}
],
"presets": [
{
"name": "Logo list",
"category": "Image",
"blocks": [
{
"type": "logo_image"
},
{
"type": "logo_image"
},
{
"type": "logo_image"
},
{
"type": "logo_image"
}
]
}
]
}
{% endschema %}
Comments
Post a Comment