No announcement yet.

Add Instagram Photo(s) to Sidebar

  • Filter
  • Time
  • Show
Clear All
new posts

  • Glenn Vergara
    This is a tutorial forum. He's just sharing some code that's working.

    Leave a comment:

  • Wayne Luke
    And what is the problem?

    Leave a comment:

  • sytyregistry
    started a topic Add Instagram Photo(s) to Sidebar

    Add Instagram Photo(s) to Sidebar

    We had a need on our forum to display the latest image from our Instagram account. Not finding much online to help, I combined a few methods from other IG API integrations and came up with something that works.

    - First off, you need to generate an access token from the Instagram Developer Page. Go HERE to do so.
    - With your access token handy, go to your forum and turn on your site editor.
    - Click Edit Page and login as Admin if not already.
    - Grab a PHP module and drag it to your desired location on the sidebar.
    - Edit it and give it a name, adjust display settings and then paste the following code in the PHP code box:

            $username = 'YOUR_USERNAME'; // your username
            $access_token = 'YOUR_ACCESS_TOKEN'; // put your access token here
            $count = 1; // number of images to show
        class InstaWCD{
        function userID(){
            $username = strtolower($this->username); // sanitization
            $token = $this->access_token;
            $url = "".$username."&access_token=".$token;
            $get = file_get_contents($url);
            $json = json_decode($get);
            foreach($json->data as $user){
                if($user->username == $username){
                    return $user->id;
            return '00000000'; // return this if nothing is found
        function userMedia(){
            $url = ''.$this->userID().'/media/recent/?access_token='.$this->access_token;
            $content = file_get_contents($url);
              return $json = json_decode($content, true);
        $insta = new InstaWCD();
            $insta->username = $username;
            $insta->access_token = $access_token;
            $ins_media = $insta->userMedia(); 
            $i = 0; 
            foreach ($ins_media['data'] as $vm): 
                if($count == $i){ break;}
                $img = $vm['images']['low_resolution']['url'];
                $link = $vm["link"];
              echo "<a href='".$link."'>" ;
              echo "<img src='".$img."'/></a>" ;
    - The code above is relatively self explanatory, but you'll really only need to edit 3 things....all of which are located at the beginning of the code.

    $username: Just erase the YOUR_USERNAME part and put in your actual username from Instagram.
    $access_token: Again, erase the YOUR_ACCESS_TOKEN part and put in your actual token from Instagram.
    $count: Change this number to set the images you want to display. For the sidebar, 1 works for me, but if you use this code elsewhere, you can make an Instagram "gallery" by changing this to....say....20 or 30.
    Hope this helps someone.

Related Topics