Question

I am using this media gallery in my site: http://tympanus.net/Development/MultiMediaGallery/
It is working with no problems in my WordPress installation, but I would like to add a drop down to filter the media into separate “galleries”. I thought the best way to do this would be add an additional attribute to the XML called ‘gallery’ and then give each media item the same name. I am trying to get this working and I modified the main mediagallery.js to assign the ‘gallery’ attribute to the id tag (although for some reason assigning all the ids the same, even though the data is parsing correctly when I checked via firebug, I’m currently working on this). Below is some code but my first question is, does this seem like the best way to do this?

This is the drop down and javascript I added to my main page (a WordPress template):

        $(window).load(function() {
            $('.media_wrapper').hide();
  $('#dropdown').change(function() {
   $('.media_wrapper').hide();
$('#' + $(this).val()) && $('.media_wrapper')
.css('display','block');
  });
});

<form>
 <select id="dropdown" name="dropdown">
  <option value="0">Choose</option>
  <option value="sunsets">Sunsets</option>
  <option value="mountains">Mountains</option>
 </select>
</form>  

Answer 1

I love when I can answer my own questions!

Anyways, just in case anyone else would like to be able to add a filter to this media gallery – you add an attribute to the xml file, make sure it is in the xsl file and then finally grab the attribute and add it as a class to the li of each media gallery item. Then simply hide and show the li’s with that class and voila you have a gallery filter.