MaGeek Lab Instagram Gallery. Documentation by MaGeek Lab v2.2


MaGeek Lab Instagram Gallery

Created: 19/08/2013
By: MaGeek Lab
Email: hello@mageeklab.com

Thank you for purchasing this plugin. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!


Table of Contents

  1. Installation
  2. Creating an Instagram App
  3. Shortcodes
  4. Parameters
  5. Widgets
  6. FAQ

A) Installation - top

To install the plugin go to Plugins > Add New > Upload and select the mgl-intagram-gallery.zip file
Activate the plugin and ¡Congratulations! The plugin have been installed.

You can also install the plugin via FTP uploading the folder mgl-intagram-gallery to your plugins folder

B) Creating an Instagram App - top

First of all, go to Adjusments > Instagram Gallery

In order to use this plugin is very important than first you create an Instagram Application in the Instagram Developer webiste

Instagram's Developer website - Creating new App

The most important thing here is that you fill the two fields of website & OAuth redirect url with the settings you have in the plugin configuration page (Name and description of the App are not important)

After creating your application, this will give you two important things, .

Instagram's Developer website - Your App

Fill the two fields (Client ID & Client secret) in the configuration page of the plugin with the information of the app

Save settings, now you are ready to Authorize your App!

Push the brand new button that has apperared right now (The blue one that says "Authorize App"). This will redirect you to Instagram and will ask your permission for the app we just created to access to your information (Be sure to be logged in with the same account you created the App)

Instagram's Developer website - Authorize

After confirming you will be redirected to the plugin configuration page, if all has gone well you well se the information of your user under the title Application settings

Application ready!

The plugin is ready to start displaying Instagram Galleries!


C) Shortcodes - top

To display Instagram photos you have five amazing shortcodes:
Not knowing what a shortcode is? Take a look here

If you are using Visual Composer don't worry about the shortcodes, our plugin have custom elements to display the galleries without them!

User Gallery

Basic:
[mgl_instagram_user]

Paste this to any page / post in your WordPress, by default it will show the last photos of the "Authorizing user"

Advanced:

[mgl_instagram_user username="USERNAME" user_id="" number="12" cols="12" pagination="true" cache="3600"]
With some attributes you can customzie the way the photos are shown

Tag Gallery

Basic
[mgl_instagram_tag tag="whitecats]

Paste this to any page / post in your WordPress, be sure to put a hastag or the shortcode will not work!"

Advanced:

[mgl_instagram_tag tag="whitecats" number="12" cols="12" pagination="true" cache="3600"]
With some attributes you can customzie the way the photos are shown

Feed Gallery

[mgl_instagram_feed]

Paste this to any page / post in your WordPress, by default it will show the last photos of the "Authorizing user" feed

Liked Gallery

[mgl_instagram_liked]

Paste this to any page / post in your WordPress, by default it will show the last photos the "Authorizing user" liked

Location Gallery

[mgl_instagram_location location_id="LOCATIONID"]

Paste this to any page / post in your WordPress, by default it will show the last media of the location's id

If you don't know the ID of the location, we've included a new shortcode:

[mgl_instagram_location_search lat="" lng=""]
You can search for locations by it's latitude and longitude, this will print a list of nearby locations with it's own ID, copy the one you need and use it in the Location Gallery


D) Parameters - top

username Username of the user to display photos from, only available in user shortcode
user_id Id of the user to display photos from, only available in user shortcode
location_id Id of the location to display photos from, only available in location shortcode
tag Tag to display photos from, only available in tag shortcode
number Number of photos to display
pagination Hide or display the "View More" link (true/false)
more_text Change the default text link
cols Columns of the gallery, by default 4
cache Time in seconds while the gallery will not reaload photos, by default is 3600 seconds (one hour)
video Include videos in the gallery (true/false)
cut_text Number of characters to display from the media description (80 by default)
direct_link Media will link directly to Instagram\'s web page (true/false)
disable_js Disable the lightbox of the gallery (true/false)
skin Choose one of the premade skins for the gallery (default, instagram, whiteslide, darkslide, elegant, dark)
responsive Enabled by default, resize the number of the columns of the gallery depending on the size of the screen (true/false)
debug Set it to true will show debug code, only for developers (true/false)

E) Widgets - top

This plugin comes with five Widgets:

Every widget can have different properties such as the time of cache, the number of media to display or the columns

The widgets

F) FAQ - top

What server requirements do I need?
Right now the plugin only requirement is cURL to properly work.allow_url_fopen is now optional

My photos aren't showing what can I do?
Check that the shortcode is not wrapped into < pre > tags, of course if you have any issue contact us via de comments section

Does this plugin comes with a Lightbox?
Yes, the Magnific Popup by dimsemenov

Does this plugin uses Flash to play the videos?
At the moment videos are played with video.js Video.js , this library handles the video player, mostly browsers load html5 player, but Firefox seems to have trouble with mp4 files,so it loads the flash players

Are the photo galleries responsive?
Yes, all columns sizes are set by percentatge so you can rescale them without problem, also the galleries will resize columns depending of the size of the screen

Do I need JQuery in order to make this plugin work?
Yes, the plugin itself loads jQuery, but you can disable it in the configuration page


Once again, thank you so much for purchasing this plugin. As I said at the beginning, I'd be glad to help you if you have any questions relating to itn. No guarantees, but I'll do my best to assist.

MaGeek Lab

Go To Table of Contents