WordPress.org

Ready to get started?Download WordPress

Forums

Media Library Assistant
[resolved] How to add category as class for image gallery item? (3 posts)

  1. ted_the_bad
    Member
    Posted 1 year ago #

    Hi

    First of all let me say this looks like a great plugin!

    I have an image gallery and I have added categories to the images using your plugin. The reason that I am doing this is to use the Isotope jQuery script to allow users to filter the image gallery by category. What I am now having trouble with is figuring out how to output the assigned category for each image as a class so Isotope can show or hide it accordingly.

    Do I need to somehow edit the output of the plugin or is there a more simple shortcode value that I am missing?

    Thanks for any help you can offer!

    http://wordpress.org/extend/plugins/media-library-assistant/

  2. ted_the_bad
    Member
    Posted 1 year ago #

    Here's an example of what I mean:

    I need the output of the mla_gallery shortcode do include the 'carhire' class (or whatever other category is assigned) in addition to the 'gallery-item' class. e.g.

    <dl class="gallery-item carhire">
    	<dt class="gallery-icon">
    		<a href="http://localhost/brideslittlehelper/gallery/test-2/" title="carhire1"><img width="150" height="150" src="http://localhost/brideslittlehelper/wordpress/wp-content/uploads/2013/01/test-150x150.jpg" class="attachment-thumbnail" alt="carhire1"></a>
    	</dt>
    	<dd class="wp-caption-text gallery-caption"></dd>
    </dl>
  3. David Lingren
    Member
    Plugin Author

    Posted 1 year ago #

    Thanks for using the plugin and for the kind words.

    I think you can accomplish your objective by creating a custom markup template and using the field-level substitution parameters to add the category terms to the class attributes. Make a new template and copy the markup from the default template. The change the "Item" markup along these lines:

    <[+itemtag+] class='gallery-item [+terms:category+]'>
    	<[+icontag+] class='gallery-icon'>
    		[+link+]
    	</[+icontag+]>
    	<[+captiontag+] class='wp-caption-text gallery-caption'>
    		[+caption+]
    	</[+captiontag+]>
    </[+itemtag+]>

    Adding the [+terms:category+] parameter within the class attribute should get you what you want. If an image is assigned to more than one category you can code [+terms:category,single+] to add just the first category to the markup.

    Let me know if that works for you, and if there are any problems I should look in to. Thanks again for using the plugin.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic