Skip to content

Instantly share code, notes, and snippets.

@marklreyes

marklreyes/liquid

Created Oct 27, 2020
Embed
What would you like to do?
FAQ Section for Shopify
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="container-fluid">
<div id="container-category-faq">
{% for block in section.blocks %}
{% if block.type == 'header' %}
<h3 id="category-faq-title" class="text-center">{{block.settings.header}}</h3>
{% else %}
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="heading-{{block.settings.id}}">
<h4 class="panel-title">
{% if block.settings.display == true %}
<a role="button" data-toggle="collapse" href="#collapse-{{block.settings.id}}" aria-expanded="true" aria-controls="collapse-{{block.settings.id}}">
{% else %}
<a role="button" data-toggle="collapse" href="#collapse-{{block.settings.id}}" aria-expanded="false" aria-controls="collapse-{{block.settings.id}}">
{% endif %}
{{block.settings.question}}
</a>
</h4>
</div>
{% if block.settings.display == true %}
<div id="collapse-{{block.settings.id}}" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="heading-{{block.settings.id}}">
{% else %}
<div id="collapse-{{block.settings.id}}" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading-{{block.settings.id}}">
{% endif %}
<div class="panel-body">
{{block.settings.answer}}
</div>
</div>
</div>
{% endif %}
{% endfor %}
</div>
</div>
</div>
</div>
</div>
{% schema %}
{
"name": "FAQ",
"settings": [],
"blocks": [
{
"type": "header",
"name": "Header",
"settings": [{
"type": "header",
"content": "Header"
},
{
"type": "text",
"id": "header",
"label": "Header"
}
]
},
{
"type": "slide",
"name": "Question",
"settings": [{
"type": "header",
"content": "Question Item"
},
{
"type": "text",
"id": "id",
"label": "id — text"
},
{
"type": "checkbox",
"id": "display",
"label": "Display Answer",
"default": false
},
{
"type": "text",
"id": "question",
"label": "Question — text"
},
{
"type": "html",
"id": "answer",
"label": "Answer — html"
}
]
}
]
}
{% endschema %}
{% stylesheet %}
{% endstylesheet %}
{% javascript %}
{% endjavascript %}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.