Site logo

[Support request] Limit the number of categories displayed

Home Forums Support [Support request] Limit the number of categories displayed

Home Forums Support Limit the number of categories displayed

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #2606523
    John

    Hello,

    I have a custom taxonomy that I display on my blog loop template. But some posts have a lot of terms attached to them, so it takes a lot of screen real estate. Is there a way to limit the number of taxonomy terms displayed?

    I’m using the GB Buttons to display the terms with dynamic data. Ideally I’d like to limit the number of terms to either a number of terms (e.g. 3) in some places, or to a single line that fits in my design.

    Is there a way to achieve that?

    Thank you

    #2606524
    John

    PS: there is probably a hacky way to hide extra terms with CSS, but I would prefer a less hacky solution if possible (i.e. with PHP)

    #2606574
    Fernando
    Customer Support

    Hi John,

    Unfortunately, there’s no filter for that.

    Another option is to re-render the list of terms and show only 3 terms through PHP. But you’d still need CSS to add styling to this.

    Do you significantly have a lot of categories for some posts well over 3?

    #2607159
    John

    Thank you Fernando.

    I have enough posts with more categories that I want to display, but more importantly I cannot control how many categories the site users will be adding in the future, and I don’t want to limit them. So I’m looking for a solution that will work regardless of how many categories are added.

    How to re-render the list of terms and show only 3 terms through PHP? I don’t mind adding CSS per se

    #2607212
    David
    Staff
    Customer Support

    Hi there,

    theres no way to filter the results of that dynamic data.
    So instead you could:

    1. Add this PHP snippet;

    function custom_post_terms() {
        $terms = get_the_terms( get_the_ID(), 'category' );
        if ( $terms && ! is_wp_error( $terms ) ) {
            $output = '';
            $count = 0;
            foreach ( $terms as $term ) {
                if ( $count >= 3 ) {
                    break;
                }
                $output .= '<a class="custom-class" href="' . esc_url( get_term_link( $term ) ) . '">' . esc_html( $term->name ) . '</a>';
                $count++;
            }
            $output .= '</ul>';
            return $output;
        }
    }
    
    add_filter( 'render_block', function( $block_content, $block ) {
        if ( 
            ! empty( $block['attrs']['className'] ) 
            && 'custom-terms' === $block['attrs']['className']  
        ) { 
            $terms = custom_post_terms();
            if ($terms) {
                return $terms;
            }
        }
    
        return $block_content;
    
    }, 10, 2 );

    2. add a Container Block with a class that you can you use to style the links.
    3. in that Container add a Headline block with a Advanced > Additional CSS Class of: custom-terms

    The function will swap the headline out for the first 3 terms

    #2607645
    John

    Thank you David. That didn’t work unfortunately, maybe because I am using button elements instead of headlines, even though I couldn’t see anything specific to headlines in the code.

    I ended up using CSS to hide all terms other than first-child and nth-child(2). That will do for now…

    #2608331
    David
    Staff
    Customer Support

    Ok, no problems.
    To cover what the function above does:

    1. you add a block with the classname. and this just acts as a placeholder nothing more.
    2. the core then swaps the placeholder out with the results of that function.

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.