composer require somardesignstudios/silverstripe-instagram
First you need to register a new Instagram Client. The client acts as a proxy between your site and the Instagram API.
In the Valid redirect URIs field enter your local, development, and production domains followed by the /admin/instagram/InstagramAccount/OAuth path. This is where CMS users are redirected after granting access to an Instagram account.
You might enter three domains like this:
http://mysite.local/admin/instagram/InstagramAccount/OAuth (development) http://dev.mysite.com/admin/instagram/InstagramAccount/OAuth (UAT) http://mysite.com/admin/instagram/InstagramAccount/OAuth (production)
After creating the client, click the Edit button to update some more details.
On the Security tab there is an checkbox for Enforce signed requests. Make sure you have this checked.
Take note of you Client ID and Client Secret as we'll need them in the next step.
Add your Instagram client details and extend the Page class.
_mysite/config/config.yml
InstagramAccount:
client_id: 'YOUR_INSTAGRAM_CLIENT_ID'
client_secret: 'YOUR_INSTAGRAM_CLIENT_SECRET'
Page:
extensions:
- InstagramPageExtensionInstagram feeds are inserted using a Shortcode, which you need to register. You can also add a button to TinyMCE which inserts the Shortcode into your content.
_mysite/config.php
ShortcodeParser::get('default')
->register('instagram', ['InstagramPageExtension', 'instagramShortcodeHandler']);
HtmlEditorConfig::get('cms')->insertButtonsAfter('fullscreen', 'instagramButton');
HtmlEditorConfig::get('cms')->enablePlugins([
'instagramButton' => '../../../silverstripe-instagram/javascript/instagramPlugin.js',
]);Run a dev/build and everything is ready to go. See the User Guide for
instructions on setting up and authorising an account in the CMS.
Instagram clients are created in sandbox mode. This put restrictions on how many items you can fetch and has reduced API limits.