To configure "Easy Instagram"...

• Steps 1-5: Register for your Instagram API client
• Steps 6-7: Authorize your Instagram API client in WordPress

To Use "Easy Instagram": Enter an "Easy Instagram" shortcode on a Post or Page, or use the "Easy Instagram" widget (shown below)

1. Open up a new browser window or tab and point it to http://instagram.com/developer/ ; then click the "Login" link in the upper right corner.
2. After you enter your Instagram login username and password, you will be taken to the "Edit Profile" page. Click the "API" link on the page's footer to take you back to the .../developer/ page.
3. Once you are back to the developers page, click the "Register" link located in the "Getting Started" diagram.
4. Click the "Register a New Client" button located in the upper right corner.
5. This should bring you to the "Register new OAuth Client" page. Enter the following information in the text fields:
   • Application Name: [title of the website for this client registry]
   • Description: [short description of your website]
   • Website: [your website's URL(example: http://www.domain_name.com)]
   • OAuth redirect uri: [this is the URL for WordPress' Settings page for the Easy Instagram plugin. Should look like this: http://www.domain_name.com/wp-admin/options-general.php?page=easy-instagram ]. As of release 2.0 this value is auto generated by default. Then click "Register". You should be taken to the "Manage Clients" panel which will list:
     • Client ID
     • Client Secret
     • Redirect URI
6. Back in your WordPress CMS, navigate to the new "Easy Instagram" panel, in the CMS menu under "Settings". Copy and paste the three fields from the Instagram "Manage Clients" panel over to the appropriate fields on the plugin Settings page. Enter the desired cache expire time in minutes. Then click the "Save Settings" button.
7. Under the "Instagram Account" heading, click the "Instagram Login" link and authorize Easy Instagram to access your account by entering your Instagram username and password. This process should return you back to the Easy Instagram Settings page in your WordPress CMS, where you will see your Instagram User ID.
   
   This numerical ID you will use to create feeds of Instagram photos specifically from your Instagram photo account.

The Easy Instagram plugin is now set up and ready to use on your website!

Usage

To create one or more Instagram photo feeds, use the Easy Instagram widget, or use the following shortcodes to generate an Instagram feed in the content area of a Post or Page. By default the shortcode will display a single image.

Examples

• [easy-instagram user_id='123456789']
• [easy-instagram tag='puppy' limit=2]
• [easy-instagram user_id='123456789' limit=4]
• [easy-instagram tag='puppy' limit=2 caption_hashtags=false]
• [easy-instagram user_id='123456789' author_format='published by %s']
• [easy-instagram user_id='123456789' limit=4 thumb_click='thickbox']
• [easy-instagram user_id='123456789' limit=4 thumb_size=90]



Options

• user_id = The numerical ID number for your Instagram account shown on the Easy Instagram Settings page
• tag = hashtags to search for
• limit = number of pictures to display (10 is max). Default: 1
• caption_hashtags = show or hide hashtags from the end of image caption. Default: true
• caption_char_limit = limit the number of characters output in caption. Set 0 for no caption output. Default: 100
• author_text = allow setting the text format for the image author. Default: "by %s"
• thumb_click = define the action on thumbnail click. Default: no action.
  1. "thickbox" -> Open the image in a Thickbox popup
  2. "original" -> Open the original image from Instagram, in a new browser tab
• time_text = defines the output format for the image time. The value "#T#" is replaced by the time value generated by the "time_format" option. Default: "posted #T#"
• time_format = defines the time format. Accepts the standard PHP time formats used by "strftime" (http://php.net/manual/en/function.strftime.php) or "#R#" for "relative time". Default: "#R#".
• thumb_size = defines the thumbnail size. Accepts an integer value for square aspect ratio or "M x N" for rectangular aspect ratio. Default: Nothing (the default Instagram thumbnail size)

For multiple photo feeds each using different hashtags or user ids, repeat the shortcode with different options set, or add the widget a second time to the same widget space, and enter different settings.




Frequently Asked Questions

Why do I have to register for an Instagram API client with this plugin?

In order to display and feed Instagram photos through a website, someone must have registered an API client with Instagram.

There are many other Instagram plugins that use the same API key for thousands of installations. Using that kind of plugin, you share the risk with all of the thousands of other plugin users that the plugin developer may disappear, may not keep the API key active, and effectively break your site feature without notice.   You also risk the plugin developer eventually charging for their plugin, especially because they're providing an API registration service on which you've become dependent.

The "Easy Instagram" advantage is that only you (your website) and Instagram are involved, and that still -- you don't need to know any code whatsoever to complete the installation process.

Basically involving a series of cuts-and-pastes, most people report having registered their API client in just a few minutes.




Can I use multiple shortcodes in the same page?

Yes, but please notice that in some cases a small penalty in the page loading time can occur.




Does the displayed image author user name link to their Instagram profile page?

Yes it does, as of "Easy Instagram" release 1.2.3.




Can I hide the image description, the image author, or the date posted / time since post?

Yes. Check out our new widget settings (leave fields blank to disable display), and our new shortcode options on the "Help" tab on the plugins Settings page in your CMS.




Can I change the size of the thumbnail?

Yes. Add thumb_size=90 to the shortcode, where 90 is the width and height of the thumbnail.




Can I disable the hashtags in the caption?

Yes. Add caption_hashtags=false to your shortcode.




What is the "Cache Expire Time" ?

To speed up page loading, the images are downloaded from the Instagram server and stored to your local web server. At the interval specified by the "Cache Expire Time", these files are deleted and read again from Instagram. This means that when a new image is uploaded to Instagram, it will not appear on your website until the next cache expiry interval.




Is it possible to arrange the images horizontally?

You can solve this using CSS styles. Each thumbnail has a div container with a CSS class on it so you can customize it the way you want.




Can I center the pictures?

Yes.  Picture alignment can be customized directly in the CSS.  To center align the picture, add the following in your style.css:
div.easy-instagram-thumbnail-wrapper {text-align:center;}

This will actually align all the content to the center.  If you want just the image to be center aligned but keep the text aligned to the left, you also need to add:
div.easy-instagram-thumbnail-author, div.easy-instagram-thumbnail-caption, div.easy-instagram-thumbnail-time{text-align:left;}




Can I feed photos with a certain tag but only from my own Instagram User ID?

Not at this time, but it's something we're working on for future versions. Currently you can choose from User ID, or Tag for each of your Instagram photo feeds.




Can I use Lightbox instead Thickbox for displaying larger images?

Yes, as of "Easy Instagram" release 2.0, but you'll have to add some code at the end of your site theme's functions.php:

add_filter( 'easy_instagram_thumb_link', 'my_theme_force_lightbox_link' );
function my_theme_force_lightbox_link( $link ) {
    $link = str_replace( 'class="thickbox"', 'rel="lightbox"', $link );
    return $link;
}


Depending on the Lightbox implementation and the fact Easy Instagram is loading the content using AJAX, you might need to trigger Lightbox for the newly added DOM elements. You can add extra Javascript code to be run after the content has loaded, by defining the code in the Plugin Settings page, under "Extra JS to run after AJAX Easy Instagram content load". For example, if you use the "wp-jquery-lightbox" plugin, you will have to use this in the "Extra JS .." field: doLightbox();