Craft Instagram Api plugin for Craft CMS 3.x

Craft Instagram Api guzzle endpoint plugin for JS to consume as AJAX

Requirements

This plugin requires Craft CMS 3.0.0-beta.23 or later.

Installation

To install the plugin, follow these instructions.

1. Open your terminal and go to your Craft project:

    cd /path/to/project
   

2. Then tell Composer to load the plugin:

    composer require admench/craft-instagram
   

3. In the Control Panel, go to Settings → Plugins and click the “Install” button for Craft Instagram.

Craft Instagram Overview

Simple Instagram Api endpoint for Craft CMS - intended for Javascript to consume as AJAX post request, returning users feed

Configuring Instagram Api

Make sure you create a .env variable with your Instagram Access Token as INSTAGRAM_ACCESS_TOKEN

Make sure you create a .env variable with your required number of posts as INSTAGRAM_COUNT

Using Instagram Api

Here is an example Vue Component which consumes the endpoint /actions/instagram-api/feed:

<script>
export default {
	props: ["csrfToken"],
	data() {
		return {
			instagramFeed: {
				data: [],
				meta: {
					code: null
				},
				pagination: {}
			}
		};
	},
	created() {
		var qsparams = qs.stringify({
			CRAFT_CSRF_TOKEN: this.csrfToken
		});
		axios
			.post("/actions/craft-instagram/feed", qsparams)
			.then(response => {
				this.instagramFeed = response.data;
			})
			.catch(e => {
				this.instagramFeed = e;
				console.log("error: " + e);
				console.log(e);
			});
	}
};
</script>

<template>
    <div>

		<div>
			<img v-for="post in instagramFeed.data" :src="post.images.thumbnail.url">
		</div>

		// See what the response is
		<pre>
			{{ instagramFeed }}
		</pre>

	</div>
</template>

Instagram Api Roadmap

Some things to do, and ideas for potential features:

• Release it

Brought to you by Adam Menczykowski