ACF Gallery with Media Categories – how do display categories and sort

Question

I would like to use something to filter images within an ACF Gallery. I have added the Enhanced Media Gallery Plugin which will allow me to assign a category to each image, but am not not clear on how to echo out that category list so it can be clicked and filter/display images in the category chosen.

Additionally, how would I echo the category assigned to the image in the div surrounding the image

My loop currently looks like this to output my gallery.

I would be grateful for any advice on the best way to assign categories to each image in my gallery (is a plugin best here?) and also how to grab those categories and sort. Thanks in Advance!

<div class="wrapper-gallery" itemscope itemtype="http://schema.org/ImageGallery">
    <?php 

    $images = get_field('images');

    if( $images ): ?>

        <?php foreach( $images as $image ): ?>

            <div class="gallery-image" id="imageGallery">

                <figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">

                    <a href="<?php echo $image['url']; ?>" itemprop="contentUrl" data-size="<?php echo $image['width'] . 'x' . $image['height']; ?>">
                        <img src="<?php echo $image['sizes']['large']; ?>" itemprop="thumbnail" alt="<?php echo $image['alt']; ?>" />
                    </a>
                    <figcaption itemprop="caption description"><?php echo $image['caption']; ?></figcaption>

              </figure>
        </div>  

        <?php endforeach; ?>

    <?php endif; ?>
0
, , , Ernie 3 years 2020-06-04T14:12:13-05:00 0 Answers 101 views 0

Leave an answer

Browse
Browse