ACF multi taxonomy on filterable gallery

I created a filterable gallery with ACF. My problem is that when I add a project to which I add several taxonomies, in my gallery I have the project as many times as I have added taxonomies. Apart from that, I would like the project to appear only once in the gallery but to appear in all the filters where the taxonomy is selected.

div id=filters class=col-3
    ul class=nav
        li data-filter=all class=filter activeTous les projets/li
        ?php
        // 1. On définit les argument pour définir ce que l'on souhaite récupérer
        $args = array (
                'post_type' = 'projet'
        );

        $terms_id = [];
        // 2. On execute la WP query
        $my_query = new WP_Query( $args );
        // 3. On lance la boucle
        if ($my_query-have_posts()) : while($my_query-have_posts()) : $my_query-the_post();
        
        $categories_du_projet = get_field( 'categories_du_projet' );     
        
        if ( $categories_du_projet ) : ?
            ?php foreach ( $categories_du_projet as $term ) : 
                if (!in_array($term-term_id, $terms_id)) :
                array_push($terms_id, $term-term_id); 
            ?
            li data-filter=?= esc_html( $term-slug ); ? class=filter?= esc_html( $term-name ); ?/li
            
        ?php endif; endforeach; endif; endwhile; endif;
        // 4. On réinitialise la requete principale
        wp_reset_postdata();
        ?
    /ul
/div

div id=elements class=col-9
    ?php
        // 1. On définit les argument pour définir ce que l'on souhaite récupérer
        $args = array (
            'post_type' = 'projet'
        );
        // 2. On execute la WP query
        $my_query = new WP_Query( $args );
        // 3. On lance la boucle
        if ($my_query-have_posts()) : while($my_query-have_posts()) : $my_query-the_post();

        $categories_du_projet = get_field( 'categories_du_projet' );
        $image_du_projet = get_field( 'image_du_projet' );
        $titre_du_projet = get_field( 'titre_du_projet' ); 
        $titre_du_projet = preg_replace('/\s+/', '_', strtolower($titre_du_projet));

        $trigger_ID = 'trigger_' . $arr_posts-current_post . '_' . get_the_ID();
        $modal_ID = 'modal_' . $arr_posts-current_post . '_' . get_the_ID();
        $close_ID = 'close_' . $arr_posts-current_post . '_' . get_the_ID();
        $image_ID = 'grandeImage_' . $arr_posts-current_post . '_' . get_the_ID();

        $images = acf_photo_gallery('galerie_du_projet', $post-ID);

        if ( $categories_du_projet ) :
            foreach ( $categories_du_projet as $term ) :
                if ( $image_du_projet ) :
                ?
                    div class=?= esc_html( $term-slug ); ?
                        figure class=trigger id=?php echo $trigger_ID ?
                            img src=?php echo esc_url( $image_du_projet['url'] ); ? alt=?php echo esc_attr( $image_du_projet['alt'] ); ? /
                            figcaption?php the_field( 'titre_du_projet' ); ?/figcaption
                        /figure
                    /div
                ?php endif; ?
        
                div class=modal id=?= $modal_ID ?
                    div class=modal-content
                        span class=close-button id=?= $close_ID ?times;/span
                        h2?= get_field( 'titre_du_projet' );  ?/h2
                        hr
                        div class=row
                            div class=image
                                ?php $image_du_projet = get_field( 'image_du_projet' ); ?
                                ?php if ( $image_du_projet ) : ?
                                    img class=?= $image_ID; ? src=?= esc_url( $image_du_projet['url'] ); ? alt=?= esc_attr( $image_du_projet['alt'] ); ? /
                                ?php endif; ?
                                img class=grandeImage /
        
                                div class=row id=gallery-full 
                                    ?php
                                        //Check if return array has anything in it
                                        if( count($images) ):
                                            //Cool, we got some data so now let's loop over it
                                            foreach($images as $image):
                                                $id = $image['id']; // The attachment id of the media
                                                $title = $image['title']; //The title
                                                $caption= $image['caption']; //The caption
                                                $full_image_url = $image['full_image_url']; //Full size image url
                                                    //Resized size to 262px width by 160px height image url
                                                $thumbnail_image_url= $image['thumbnail_image_url']; //Get the thumbnail size image url 150px by 150px
                                                $url= $image['url']; //Goto any link when clicked
                                                $target= $image['target']; //Open normal or new tab
                                                $alt = get_field('photo_gallery_alt', $id); //Get the alt which is a extra field (See below how to add extra fields)
                                                $class = get_field('photo_gallery_class', $id); //Get the class which is a extra field (See below how to add extra fields)
                                    ?
                                        
                                        div class=thumbnail
                                            img id=image_?= $id; ? src=?= $full_image_url; ? alt=?= $title; ?
                                        /div
                                    ?php endforeach; endif; ?
                                /div
                            /div
        
                            div class=description
                                h3Description/h3
                                p?php the_field('description_du_projet'); ?/p
                            /div
                        /div
                    /div
                /div

All I want is just no duplicate pictures on all project just one picture, not one per taxonomies. If anyone can help me please... Too much time on it and I found nothing to help me.

This is my var_dump($term) and on this 3 pictures only one can display the modal. I want on All project display just one picture and when I choose one of the 3 filters, can click on it and display the modal

Topic advanced-custom-fields multi-taxonomy-query custom-field Wordpress

Category Web


Instead of getting all of the image IDs and then cycling through them and outputting each one, you would first collect them into a single array and then use array_unique() to remove the duplicates.

        if( $categories_du_projet ) :
            $image_array();
            foreach( $categories_du_projet as $term ) :
                if( $image_du_projet ) :
                    $image_array[] = $image_du_projet;
                endif;
            endforeach;
            $image_array = array_unique( $image_array );
            foreach( $image_array as $image_article ) :
                //now run your output method using $image_article rather than $image_du_projet
                //you'll probably have to change how you're obtaining things like the URL, ALT, etc.
            endforeach;
        endif;

What I'm not sure of is $image_du_projet = get_field( 'image_du_projet' ); and what that actually gets. I'm assuming it's the ID of the image. If that's wrong you'll probably need to modify things a bit.

Perhaps then you'd need to add this:

$image_du_projet_id = $image_du_projet['ID'];
$image_array[] = $image_du_projet_id;

Sorry I can't give a definitive answer in that regard but there's no way for me to really test it as I don't have ACF or those fields configured anywhere.

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.