Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Vantage - Instagram API update
<script id="instagram-template" type="text/template">
{% raw %}
<div class="desktop-2 tablet-1 mobile-1 contained">
<a class="instagram-image-container" target="_blank" href="{{link}}" rel="ig" title="{{caption}}">
<img class="instagram-image" src="{{image}}" />
</a>
</div>
{% endraw %}
</script>
<div class="homepage-section instagram-feed" data-section-id="{{ section.id }}" data-section-type="instagram">
{% if section.settings.full-width %}
<div class="gridlock-fluid"><div class="row">
{% endif %}
<section id="index-social" class="row">
{% if section.settings.title != blank %}
<h2 class="section-title desktop-12 tablet-6 mobile-3"><a href="{{ collection.url }}">{{ section.settings.title | escape }}</a></h2>
{% endif %}
{% assign token = section.settings.instagram-access-token | escape %}
{% capture userid %}
{{- token | truncate: 9, "" -}}
{% endcapture %}
<div class="clear"></div>
<div id="instagram-feed" {% unless section.settings.full-width %}class="desktop-12 tablet-6"{% endunless %}>
{% if section.settings.instagram-access-token != blank %}
<div id="instafeed-{{ section.id }}" data-access-token="{{ token }}"></div>
{% else %}
{% include 'onboard-instagram' %}
{% endif %}
</div>
</section>
{% if section.settings.full-width %}
</div></div>
{% endif %}
</div>
<style>
.instagram-image-container {
display: block;
height: 0;
padding-bottom: 100%;
overflow: hidden;
margin-bottom: 0px;
}
</style>
{% schema %}
{
"name": "Instagram feed",
"settings": [
{
"type": "checkbox",
"id": "full-width",
"label": "Full width"
},
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "Follow us on Instagram"
},
{
"type": "textarea",
"id": "instagram-access-token",
"label": "Instagram access token",
"info": "Required for permission to show your Instagram content [instructions here](http://support.undergroundmedia.co.uk/customer/en/portal/articles/2386318-home-page---instagram-feed) for setup."
}
],
"presets": [
{
"name": "Instagram feed",
"category": "Social media"
}
]
}
{% endschema %}
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.