Streaming live at 10am (PST)

How to adjust default "view" in an Isotope gallery with filter buttons


#1

I’ve got an Isotope gallery I’m using with filter buttons, but it seems the default view of the gallery is “all.” I’d like to, in my case, have it show my “fewer headshots” filter first, with the “more headshots” or basically “all” filter as a secondary view that must be clicked on to be seen.

Does anyone have any idea how to specify which filter item is the default view or initial view upon loading?

Thank you!

Here’s my preview link: https://preview.webflow.com/preview/kristinepaulsenphotography?preview=018969735d3025b01cfac002cbd7c3e2 - it’s the Headshots page I’m referencing here.

ETA: Here’s a site that looks like it’s trying to do what I want, and while I understand what’s going on here, I’m not sure how to adjust the code to make it work for my site. Any ideas/suggestions/help? Thank you!

http://jsfiddle.net/desandro/DA3wF/


#2

Nevermind - figured it out, in case anyone is trying to do the same thing.

I just added a “filter” line to this code, and specified which filter I wanted to be seen first instead of the default “all”:

  // init Isotope
  var $grid = $('.grid').isotope({
    filter: '.fewerheadshots',
    itemSelector: '.item'
  });

It was based on the info found in this post: