Support

Account

Home Forums ACF PRO Insert unique ID before first instance of field

Solved

Insert unique ID before first instance of field

  • So I am working on a site where records are input into a system and sorted alphabetically by the artist’s name: Abba being sorted by A, David Bowie by B, Chicago by C & so on. So basically I am looking to inject into the code a div with the unique ID of “sort-A” (or something to that effect at least including the letter in which I am sorting the entry by). I get the sorting letter via a custom field set as $sort.

    <?php if ( have_posts() ) : ?>
                        <?php
                        // Start Records Loop
                        while ( have_posts() ) : the_post();
                        $serial = get_field('serial');
                        $sort = get_field('sort'); // Gives The Sort Letter
                        $artwork = get_field('artwork');
                        $size = 'medium';
                        $thumb = $artwork['sizes'][ $size ];
                        $width = $artwork['sizes'][ $size . '-width' ];
                        $height = $artwork['sizes'][ $size . '-height' ];
                        $artist = get_field('artist');
                        $album = get_field('album');
                        $release = get_field('year');
                        $copies = get_field('copies');
                        $noartwork = get_field('no_album_art', 'option');
                        if ( $thumb ) { $art = $thumb; } else { $art = $noartwork; }
                        if ( $copies > 1) {
                            $copy_text = 'Copies';
                        } else {
                            $copy_text = 'Copy';
                        }
                        ?>
                        <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2" tabindex="0" data-sort="<?php echo $sort; ?>" data-serial="<?php echo $serial; ?>" itemscope itemtype="http://schema.org/Product">
                            <div class="cover-layout">
                                <a href="<?php echo esc_url( get_permalink() ); ?>" class="cover-art" title="<?php the_title_attribute(); ?>" target="_self">
                                    <div class="serial">
                                        <div class="serial-num"><?php echo $serial; ?></div>
                                    </div>
                                    <div class="cover-art-hover">
                                        <i class="icon-more-large"></i>
                                    </div>
                                    <div class="cover-art-image" style="background-image:url('<?php echo $art; ?>');"></div>
                                </a>
                                <div class="mo-info">
                                    <div class="mo-info-artist">
                                        <a href="<?php echo get_home_url(); ?>/?s=<?php echo $artist; ?>" class="mo-info-name" title="View All albums by <?php echo $artist; ?>" target="_self"><?php echo $artist; ?></a>
                                    </div>
                                    <div class="mo-meta ellipsis-one-line">
                                        <div class="mo-info-album">
                                            <a href="<?php echo esc_url( get_permalink() ); ?>" title="<?php the_title_attribute(); ?>" target="_self">
                                                <span><?php echo $album; ?></span>
                                                <small><?php echo $copies; ?> <?php echo $copy_text; ?></small>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <?php
                        endwhile;

    This way I can set the system to scroll to a specific letter if need be, or inject the letter indicator “A” into that unique ID so before the entries for “A” begin, it says “A” then those entries, then “B” for those entries and so on.
    Any help would be appreciated.

  • Sorry, it is not 100% clear what you need help with.

    You already have all the posts sorted by this “sort” field when you do the query that’s not shown?

    You want to “group” the posts in some way by the value of the custom field?

    If this is the case then the basic idea would be something like this

    
    <?php 
      
      // your query here
      
      if (have_post()) {
        $last_sort = '';
        while (have_posts()) {
          the_post();
          $sort = get_field('sort'); // Gives The Sort Letter
          if ($sort != $last_sort) {
            // the sort leter has changed
            ?>
              <div id="sort-<?php echo $sort; ?>"><?php echo $sort; ?></div>
            <?php 
            
            // set $last_sort to new $sort
            $last_sort = $sort;
            
          } // end if short changed
        } // end while have posts
      } // end if have posts
      
    ?>
    
  • I’m sorry for the confusion John. Okay, so I have 800 or so custom_post_types (records) which each have a letter they are being sorted by (either the first name of the musical artist or the band name). These values are chosen inside the custom_post_type via an ACF. WordPress then uses the standard while loop to list out all of the records (which are already in the correct order).
    So what I am looking to do is have the code determine where the first custom_post_type with an ACF ($sort) value of “A” is being looped in, and inject a custom div with the text “A” before that. Then before first custom_post_type ACF value or “B” begins, inject a custom div with “B” in… and so on and so fourth all the way until “Z”.
    So I am not sure if the best methodology would be to do a php count of all the custom_post_types with the ACF ($sort) value of “A”, “B”, “C”, etc before the while loop and then just have some custom php conditional statement tied into the while loop so that the code knows that after 200 or so entries it needs to insert some html code identifying that the user is now viewing “B” custom_post_types so, then at 340 “C”, etc.
    The end code I am hoping the html spits out is…

    <div id="ajax" class="records row">
       <div id="artist-a">A</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">A01</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">A02</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">A03</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">A04</div>
       <div id="artist-b">B</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">B01</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">B02</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">B03</div>
       <div id="artist-c">C</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">C01</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">C02</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">C03</div>
       <div class="record col-xs-6 col-sm-4 col-md-3 col-lg-2 col-xl-2">C04</div>

    Of course these numbers are dynamic and dependent on however many entries (custom_post_types) exist in the back-end of the system.

  • See my last comment, the code I posted would do that. It’s similar to using a count variable except that it is keeping track of what the last sort value was and comparing it to the current one and then adding a div if they have changed.

  • Dude John, you are the freaking man! Thank you so so very much!!!!

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.