Skip to content

Instantly share code, notes, and snippets.

@EricSeastrand
Last active March 13, 2019 19:35
Show Gist options
  • Save EricSeastrand/fbc4e4757fc216a67b903acb4fb3de50 to your computer and use it in GitHub Desktop.
Save EricSeastrand/fbc4e4757fc216a67b903acb4fb3de50 to your computer and use it in GitHub Desktop.
This Shopify "section" will allow you to add a Twine social feed to any sectioned page by entering the app ID.
{% assign urlParam_app = section.settings.appName | url_encode %}
{% assign urlParam_showNav = section.settings.includeNavBar | url_encode %}
{% case section.settings.loadingBehavior %}
{% when 'automatic' %}
{% assign urlParam_showLoadMore = 'no' %}
{% assign urlParam_autoload = 'yes' %}
{% when 'none' %}
{% assign urlParam_showLoadMore = 'no' %}
{% assign urlParam_autoload = 'no' %}
{% else %}
{% assign urlParam_showLoadMore = 'yes' %}
{% assign urlParam_autoload = 'no' %}
{% endcase %}
{% capture twineQueryString %}
app={{ urlParam_app }}&showNav={{ urlParam_showNav }}&autoload={{ urlParam_autoload }}&showLoadMore={{ urlParam_showLoadMore }}
{% endcapture %}
{% unless section.settings.customLayoutId == '' %}
{% capture twineQueryString %}
{{twineQueryString}}&layout={{ section.settings.customLayoutId | url_encode }}
{% endcapture %}
{% endunless %}
{% capture twine_section_content %}
<h2 class="section-title">
<i class="fa fa-instagram"></i> Instagram
<script data-id="twine-script" data-instance-id="qsfjas" src="//apps.twinesocial.com/embed?{{ twineQueryString | strip }}"></script>
</h2>
{% endcapture %}
<div class="page-width">
<div class="custom-content">
<div class="custom__item one-whole">
{{ twine_section_content }}
</div>
</div>
</div>
{% schema %}
{
"name": "Twine Social Feed Embed",
"settings": [
{
"id": "appName",
"type": "text",
"label": "Twinesocial App Name"
},
{
"id": "customLayoutId",
"type": "text",
"label": "Custom Layout ID (optional)"
},
{
"type": "select",
"id": "includeNavBar",
"label": "Include Nav Bar",
"options": [
{
"value": "yes",
"label": "Yes"
},
{
"value": "no",
"label": "No"
}
]
},
{
"type": "select",
"id": "loadingBehavior",
"label": "When viewers reach the end of the feed",
"options": [
{
"value": "none",
"label": "Do Nothing"
},
{
"value": "automatic",
"label": "Automatically load more items"
},
{
"value": "manual",
"label": "Display a \"Load More...\" button"
}
]
}
],
"presets": [{
"name": "TwineSocial Feed Embed",
"category": "Social"
}]
}
{% endschema %}
{% stylesheet %}
{% endstylesheet %}
{% javascript %}
{% endjavascript %}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment