7

I am using instafeed.js to show my latest instagram images in my website. But by default, image links are opened in same window. This is the JS code: https://github.com/stevenschobert/instafeed.js/blob/master/instafeed.js more information: http://instafeedjs.com

I tried to open links in a new window by using this trick:

<script>
$(function(){
  $("#instafeed a").attr("target","_blank");
});
</script>

But this trick is not working in this situation.

Any Solution? Thanks.

neelsg
  • 4,802
  • 5
  • 34
  • 58
Kasra
  • 81
  • 1
  • 6
  • 3
    I haven't used instafeed before, but can't you use the template option? `template: ''` – Jop Jun 17 '14 at 11:58
  • @Jop Thanks, but I don't know why this option is not working. Finally I added `anchor.target = '_blank';` to JS file and now links opened in new window. – Kasra Jun 17 '14 at 12:54
  • 1
    @Kasra - you should never modify a libraries source files directly nor should you ever have to... Steven and Jop have provided you with the correct answers using the templating options available with the plugin. Tested and confirmed working perfectly. – zigojacko Mar 06 '15 at 16:25

3 Answers3

12

The best way to do it, would be to use the template option:

var feed = new Instafeed({
  template: '<a href="{{link}}" target="_blank"><img src="{{image}}" /></a>'
  // other settings...
});

You shouldn't need to modify the source file directly.

For more information on how templates work, check the documentation on templating.

Steven Schobert
  • 4,201
  • 3
  • 25
  • 34
4

I update the links in the after function

jQuery(document).ready(function($){
  var loadButton = $('#load-more');
  var feed = new Instafeed({
    get: 'user',
    userId: xxx,
    accessToken: 'xxxx',
    limit:160,
    after: function() {
      $("#instafeed a").attr("target","_blank");
      // disable button if no more results to load
      if (!this.hasNext()) {
        loadButton.attr('disabled', 'disabled');
      }
    }
  });    

  $('#load-more').on('click', function() {
    feed.next();
  });
  feed.run();
});
Mat Kay
  • 508
  • 1
  • 11
  • 24
0

Gotcha! Following Kasra's logic, found the solution:

In your instafeed.js file, look around line 177 and add anchor.setAttribute('target', '_blank'); works beautifully.

Macarrao
  • 60
  • 1
  • 11
  • 1
    It's a quick fix, but I would never change or reedit a library to avoid lost on newest updates – StefGuev Jan 28 '19 at 16:46
  • You have a good point definitely... this is a very old post, I can't tell if the instafeed version of that time had the template option or if it worked the same as more recent versions. – Macarrao Jan 28 '19 at 20:27