# Templates
To fetch the Instagram posts, use the craft.instagram.getFeed()
function:
{# fetch account specified in settings #}
{% set items = craft.instagram.getFeed() %}
So you can iterate over all posts like this:
{% for item in craft.instagram.getFeed() %}
<a href="https://www.instagram.com/p/{{ item.shortcode }}/" target="_blank" rel="noopener noreferrer">
<img src="{{ item.thumbnail }}" alt="" />
</a>
<p>{{ item.caption }}</p>
<p>{{ item.likes }} Likes / {{ item.comments }} Comments</p>
{% endfor %}
If you are using a volume to store the images locally, you have a full asset object and you can do things like this:
{% for item in craft.instagram.getFeed() %}
<a href="https://www.instagram.com/p/{{ item.shortcode }}/" target="_blank" rel="noopener noreferrer">
<img src="{{ item.asset.getUrl({ mode: 'fit', width: 100, height: 100, format: 'webp'}) }}" alt="" />
</a>
<p>{{ item.caption }}</p>
<p>{{ item.likes }} Likes / {{ item.comments }} Comments</p>
{% endfor %}
You can also pass an account name or hashtag to overwrite the default from the settings:
{# fetch account by name #}
{% set items = craft.instagram.getFeed("codemonauts") %}
{# fetch hashtag #}
{% set items = craft.instagram.getFeed("#mrmcd2019") %}
# Data Structure
The craft.instagram.getFeed()
function returns an array of posts with the following keys:
[
'src' => '', # DEPRECATED Same as thumbnail
'thumbnail' = '', # URL to the locally stored thumbnail
'thumbnailSource' = '', # URL to the thumbnail provided by Instagram
'image' => '', # URL to the locally stored original image
'imageSource' => '', # URL to the original image provided by Instagram
'asset' => null, # The asset object of the locally stored original image (only available when using volumes)
'assetId' => 0, # Asset ID of the locally stored original image (only available when using volumes)
'likes' => 0, # Number of likes
'comments' => 0, # Number of comments
'shortcode' => '', # The IG shortcode for the post
'timestamp' => 0, # Unix timestamp when the picture/video was taken
'caption' => '', # The caption of the post
'isVideo' => false, # If the post is a video
'hasAudio' => false # If the video has audio
'video_view_count' => 0, # Number of video views
]
← Local storage Caching →