Photonic lets you display recent and specific photos of users from Instagram, in addition to supporting display of photos with specific hashtags or shot in specific locations. The switch to show Instagram photos is the
type='instagram' parameter. Photonic only displays photos from users whose profiles are not private.
Displaying Own Photos (🔗)
In its simplest form, if you simply specify the
user_id, the most recent photos for that user are shown:
[gallery type='instagram' user_id='255171917']
You could also be explicit and specify that you want to fetch recent photos only, using the
[gallery type='instagram' view='recent' user_id='255171917' thumb_size='150']
With effect from version 2.00 the
user_id for Instagram is not required. As it happens, as per the note below only the currently authenticated user’s photos are visible. As a result, not passing the
user_id will simply cause the authenticated user’s photos to show up.
Photonic has been built to support all of the following scenarios, however the culprit here is the approvals team at Instagram, who have been refusing to allow the plugin access to others’ public content. Apparently, according to them, the end users of the plugin are not brands or advertisers or broadcasters or publishers – not sure where they get the idea! As a result of this, in the following examples you will see a message saying “This client has not been approved to access this resource.” Even if the following do not work for you, you will still be able to display photos from your own feeds using Photonic, while I continue the battle to get Instagram’s approval.
Displaying Others’ Public Photos (🔗)
Let’s say you run a small business with a WordPress-based website. Your company has multiple people who post WordPress content with different logins, and each has an Instagram account from which they pull photos to display in their posts. They can do this by tweaking the
user_id parameter in the above shortcode.
The following pulls photos for a user different from the first two examples:
[gallery type='instagram' view='recent' user_id='256983297' thumb_size='150']
Running Marketing Campaigns (🔗)
Let’s say you have run a marketing campaign wherein you have asked people to post pictures with a certain hashtag. You can use Photonic to display on your WordPress site all such photos that users with public profiles have posted. You do this by fetching photos with specific tags, via a
tag_name parameter, when you set
view='tag'. This usage doesn’t require a
user_id to be passed to the shortcode:
[gallery type='instagram' view='tag' tag_name='MyAwesomeCampaign' layout='random']
I have demonstrated photos with the tag “Fauna” in the above, but you could use pretty much any tag that you are trying to track in
Discovering Content Related to You (🔗)
Consider the case where you run a resort. People visiting the resort often post pictures, and they specify the location of your resort when they do so. You can use Photonic to pull such photos by location.
Location-based search is triggered by
view='search' and requires the
lat (i.e. latitude) and
lng (i.e. longitude) parameters. The following pulls photos from Markele National Park, in South Africa:
[gallery type='instagram' view='search' lat='-24.421079' lng='27.663459' count=10]
You could use a
location_id (instead of the latitude or longitude). When you set the location for a photo in Instagram, the URL for the location takes the format https://www.instagram.com/explore/locations/1033911916/marataba-safari-lodge/. The highlighted portion is the location id. The following are photos from South Padre Island (location id 215494828):
[gallery type='instagram' view='location' location_id='215494828' layout='circle' thumb_size='200']
“Photo of the Day” (🔗)
In continuation of the previous example, if you wish to run something along the lines of a “Photo of the Day” campaign, you can display a specific photo. This will show a photo, complete with attribution and the number of likes / comments for that photo. For this you can use the
media_id parameter, to which you pass the shortcode for a photo. To find the shortcode of a photo, look at the last portion of a photo’s page, e.g. https://www.instagram.com/p/BOyLANGBC3Z/. The highlighted portion is your shortcode:
[gallery type='instagram' media_id='BOyLANGBC3Z']
What if you had some videos in the mix? Photonic can handle that too. I have the philosophy that Photonic is meant for photos, not videos, because Photonic’s primary goal is to assist in making photos easily and beautifully presented for photographers using WordPress. In fact most online photo services deprioritize videos with the same philosophy, and some services don’t even have videos! At the time of writing 500px.com doesn’t have videos, and guess what? Native WordPress galleries don’t support videos! That being said, people often use photo services, notably Instagram to share personal videos, and so, with effect from version 1.66 of Photonic, videos are supported.
Videos are turned off by default for each provider. For Instagram the setting is under Photonic → Settings → Instagram → Instagram Settings → Media to show. Regardless of this setting, you can explicitly pass the
media parameter to your shortcode. This parameter takes values
photos (to show photos only),
videos (to show videos only) and
all (to show both photos and videos). I have videos turned off on my website, so I will use the
media parameter to show videos from my account:
[gallery type='instagram' user_id='255171917' media='all' count=10]
Note that lightboxes have notoriously flaky support for externally hosted videos. Please refer to the lightboxes page to see which ones can be used.
Videos can be incorporated into any layout.
Deferred Loading, a.k.a. “Show Gallery” (🔗)
In the examples above you see a button that says Show Gallery. This is a feature that ensures that Photonic doesn’t make the call to your photo source when your page is first loaded. It instead defers the call to your photo source until it the button is explicitly clicked by your end user. Using this button ensures that your page loads quickly the first time.
This button is created by adding the shortcode attribute
show_gallery="Click to see gallery". You can replace “Click to see gallery” with the text of your choice.
Authentication and Setup (🔗)
Photonic works differently for Instagram than it does for other providers. For all other providers, Photonic lets visitors of your blog perform authentication and see content you have authorized them to see. But for Instagram, Photonic lets you perform authentication, and your users see the same public photos that you are authorized to see. Due to this, you don’t have to store any client ID or secret.
This is the process of setting up the plugin to work with Instagram:
- Install the plugin and activate it.
- Go to the page Photonic → Authentication (Photonic → Helpers in versions of Photonic older than 1.65) in your admin dashboard.
- Look for the button to perform authentication:
- When you click on it, you will be taken to an Instagram authentication page:
- Once you “Authorize”, you will be taken back to your WP Dashboard, and your token will be displayed:
- Copy the Access token, then head over to Photonic → Settings → Instagram → Instagram Settings, and put in the value that you just obtained:
That’s it! You are good to go.
Photonic is a WordPress plugin providing registered users of Instagram an ability to display Instagram photos on their WordPress websites.
The access token retrieved by Photonic only has permissions to read basic profile information and view content shared publicly. It does not follow, post, like or comment on any content on your behalf. This access token is unique to you, and is not saved anywhere apart from your own WordPress installation.
Photonic neither collects internally, nor phones back, nor shares your information with any third-party. Ever.