Photo and Video Search with Filters and Usernames using Instagram API

Challenge

Our client was looking for a custom instagram search. He needed it for a video editing process outside from the site. He liked the way Instagram is designed and the availability of the images on the platform. So he decided to tap this collection and work on a search so that his video production workflow can become a lot easier.

Our task mainly was to:

  • Facilitate settings for Instagram API
  • Integrate the API with our plugin
  • Implement a search based on either username or hashtag
  • Implement a search result filter for images or videos or both
  • Display the details of the contents (such as title/hastags)
  • Facilitate a download feature to easily download the content
  • Implement a Load more (ajax loader) for easy content browsing

Our Solution

This was a simple project. We knew Instagram but we had to design the search aspect of it on our end. We tried to make it as trouble-free of a solution as it could be. We made it so that you can just install and it takes care of the rest!

Here’s how we solved the problem:

API Settings

API Settings can sometimes be daunting. We have integrated a settings interface with our plugin that is self explanatory. It keeps even the novice users in mind and provides link to useful sites for the configuration when necessary.

Search Integration with Shortcode

We have integrated the search with a shortcode. The shortcode communicates with Instagram API and provides a frontend for the search and its various features. We were also asked to design the interface similar to other tools our client use.

Search Filter

The search can be filtered based on image or video or both. Either one can be selected and we designed our code around this selection. It shows the result depending on the selection to facilitate easier finding of the right content.

Content Display

We have tried to make the interface as intuitive and useful as possible. It shows the content thumbnail, hashtags, category (either image or video) and download button. It also shows the search results with an ajax powered Load More option so that the user does not have to jump through pages to find the right content.

Download Feature

Our client wanted a download option that can be used to easily let him download the content for later use.

Putting it all together

Our plugin integrates the search and all the details into a one small package for easier use. It is designed to be configure-and-forget. When working on it we got to learn many ins and outs of the Instagram API and it was also interesting to develop the search result features. Hope it helps our client in the years to come.

This was a short project but we had fun working on it.

Testimonials