Saturday, 25 April 2015

Instamax 3.0 - Instagram Account Photos and HashTag Gallery for your website

DOCUMENTATION

Step 1: Upload Package to Server

Upload the folder instamax to your hosting server.

You can also host specific file on your server that are mandatory for the plugin -

  1. The jQuery file jquery-1.11.2.min.js or any latest version you want
  2. The InstaMax Javascript file jquery.instamax.min.js
  3. The InstaMax CSS file instamax_clean.css

Step 2: HTML

Create a container element in your HTML having the class instamax.

<div id="instamax" class="instamax"></div>

Step 3: Javascript

Call the plugin in your Javascript as below

$("#instamax").instamax({ //Access Token generated at InstaMax Token Generator //http://demos.codehandling.com/youmax_demo/photomax_token.html accessToken:"260796206.0efbe26.89a76a9668934089a2d00d928486fd26", //Link to your Instagram Account user:"https://www.instagram.com/hiltonic_", //HashTags if required hashtag: [ "#doodle", "#beach" ], //Skin can be grey|white|clean skin:"grey", //Tab shown by default. Can be p|h1|h2|... selectedTab:"p", //Alwasy show dropdown instead of Tabs alwaysUseDropdown:false, //Can be user|global //HashTags will get photos from User Account or Instagram Global tagScope:"user", //Widget Mode widgetMode:false, //Can be popup|link displayMode:"popup", //Maximum Results maxResults:15, //Distance between thumbnails innerOffset:30, //Distance between thumbnail & container outerOffset:30, //Minimum thumbnail widht minItemWidth:200, //Maximum thumbnail widht maxItemWidth:300, //Maximum Container width maxContainerWidth:800 });
THOUGHTS ?

40 comments:

  1. Replies
    1. Why not? If you shared your correct email, you will receive the link to our plugin download vault.

      Delete
  2. Hi, I am getting the following error when I replace my clientId
    instamax_global_options.userName = response.data[0].username;

    any ideas of why?

    however when i replace this for accessToken, it works
    but I am using the accessToken from another example, how can I generate my own token?

    Thank you

    ReplyDelete
  3. Fabian, you need to use the Access Token. You can generate your personal Token at our Instamax Token Generator - http://demos.codehandling.com/youmax_demo/photomax_token.html

    Cheers :)

    ReplyDelete
    Replies
    1. Hi Thank you very much that worked!!!
      Can I ask you,does this token expire? and does this applies the global limits (https://www.instagram.com/developer/limits/) 500 / hour?
      Thank you

      Delete
    2. Our App is Live so you rate limit will be 5000/hour.

      I hope you are subscribed to my list man. We are launching our latest project "Dream Pack" this month end, and we want all you guys to get the initial access to our project :)

      Delete
  4. Is there a way to get rid of the Instargram user info/header and only show the photo gallery? Also, it there a way to only show a specific hashtag and not have an option to view any others?

    ReplyDelete
    Replies
    1. Sure, you can add the below CSS text to hide the Instamax header -
      #instamax-header {display: none !important;}

      Cheers :)

      Delete
  5. Hi! Thanks for your great project here!!:)

    However, I was trying to modify the skin of gallery. I just change "grey" to be "white" (e.g. skin:"white"), but it seems not work for me. Do you know what happens? Thanks.

    ReplyDelete
    Replies
    1. You also need to change the CSS file in your Head section. It should link to instamax_white.css in your case :)

      Delete
    2. Oh! Yeah! Thank you so much!!
      Excellent work!! Keep going!:)

      Delete
  6. Hi Jake, can you tell me about that dose this access token expire? Is this token depend on IG or you?

    (accessToken:"260796206.0efbe26.89a76a9668934089a2d00d928486fd26")

    Because it seems has to generate by your Instamax Token Generator.
    I'm afraid that if the token was expired or once your server was suspended unfortunately, I can't use the plugin anymore. Thanks.

    ReplyDelete
    Replies
    1. Yin, you can generate your Tokens from our Token Generator. In case it gets expired, you can generate another one. You can keep using the plugin forever with any Instagram token :)

      Delete
  7. Sorry to bother you:( , can I ask you that why only the access token generated by your "InstaMax Token Generator" can be requested the media of other users?

    Is this because your APP is live and has approved by Instagram to use the public_content scope permission?

    Am I right/wrong? I am looking forward to your reply soon. Thanks><

    ReplyDelete
    Replies
    1. Yes, we have Instagram permissions to get public content (which is actually quite rare) :D

      Delete
    2. Incredibly! You got one.. :O

      Delete
  8. Hi,
    I'd like to know: is it possible to get Instamax to work on a jimdo webpage? Thx.

    ReplyDelete
    Replies
    1. I've never tried myself. But if you can use and jQuery plugin on Jimdo, then you can easily use InstaMax too :)

      Delete
  9. Hi there, 2 questions :)
    1) is the 5000 limit per hour total limit per token or total limit for all users who has got your product_?
    2) How can I show any hashtag by default on page load_?

    Thanks!

    ReplyDelete
    Replies
    1. 1. It should be per Token.
      2. The "selectedTab" option will allow you to show any Tab by default on page load

      Delete
    2. This comment has been removed by the author.

      Delete
    3. Set it to "h1" to select the first hash Tag.

      Delete
  10. This comment has been removed by the author.

    ReplyDelete
  11. Hey friend.

    Thank you so much for that plugin, it's awesome!

    I'm using it in a little system I'm trying to do. Let me know one thing, how can I avoid the display of videos, display only photos? And also, how can I change the behavior when I click in some photo, like, instead of showing photo information, do another thing? The JS is all in one line, I can't programmaticaly change something.

    ReplyDelete
    Replies
    1. We have an option to either display popup or link to Instagram photo. Other than that you will need to update the code :)

      Delete
  12. Hello Thank you for sharing this plugin, how to do step 3?

    ReplyDelete
    Replies
    1. You need to copy the code from step3 into your HTML page.

      Delete
  13. the code does not work... is this still in service?

    ReplyDelete
    Replies
    1. The Demo is working buddy, right?
      The plugin is fully functional. Share the link to your page and I can help you out :)

      Delete
  14. Thanks for the plugin, how i can make the height not the same for all images?

    ReplyDelete
    Replies
    1. The heights of the images come from Instagram. We do not change those heights in the plugin :)

      Delete
  15. Thanks for the plugin. It´s great. I have one question. I wanna hide the information of the user, showing only the photos. It´s possible? Thanks.

    ReplyDelete
    Replies
    1. You can add the below CSS into your page to hide the header and stuff -

      div#instamax-header, #instamax-tabs, #instamax-select-box {display: none !important;}

      Delete
  16. This comment has been removed by the author.

    ReplyDelete
  17. Hi, thanks for a great plugin! But I get blurry pics in my feed. When I look in the code the image size is 306x306px. And with my configuration, the images are resized to 337x337px. How can I load larger images before they are resized?

    ReplyDelete
    Replies
    1. Found it!
      updatedAlbumThumbnail=albumThumbnail.replace("s150x150","s306x306");
      replaced it with
      updatedAlbumThumbnail=albumThumbnail.replace("s150x150","s350x350");
      Thanks again :)

      Delete
  18. Hi, great plugin! Modified it a bit to suit my needs, looks quite slick actually ( http://gropio.com/stek/file/zdlemc ). But im trying to instead of placing pictures in a new row when resizing I want to remove them/hide them so it's ALWAYS only one row. Since it's placed directly above the footer and with no borders/margin/padding it would be awesome. Any solution for that?
    Cheers!

    ReplyDelete
  19. Hi. I have problems with the popups. The images and and comments are shown nicely, but the text from the captions are missing. Emojis from the captions are displayed however. Any idea why this could be? I use bootstrap on the site also.

    ReplyDelete
    Replies
    1. Ok this was embarrassing. I forgot I have light font on the page so it has invisible on the background. Never mind.

      Delete
  20. I see this listed as free on Stackoverflow, but the download link has a charge.

    ReplyDelete