0

I'm slowly building my own WordPress theme and want to have a related posts section at the bottom of each post (for example here on my site).

I am using the following code to generate the related posts:

<footer>
    <div class="container-fluid related-posts">
        <div class="row">
            <?php $categories = get_the_category($post->ID); ?>
            <?php if ($categories): ?>
            <?php $category_ids = array(); ?>
            <?php foreach($categories as $individual_category) : ?>
            <?php $category_ids[] = $individual_category->term_id; ?>
            <?php endforeach; ?>
            <?php $args=array(
                'category__in' => $category_ids,
                'post__not_in' => array($post->ID),
                'posts_per_page'=>3,
                'ignore_sticky_posts'=>1,
                'oderby' => 'rand'
            );?>
            <?php $my_query = new WP_Query($args); ?>
            <?php if( $my_query->have_posts() ) : ?>

            <section class="container-fluid">
                <h2>Related Articles</h2>
                    <div class="row">
                        <?php while ($my_query->have_posts()) : $my_query->the_post(); ?>
                            <div class="col-sm">
                                <a href="<?php the_permalink()?>" class="related-thumb"><?php the_post_thumbnail(); ?></a>
                                <h3><a href="<?php the_permalink()?>"><?php the_title(); ?></a></h3>
                                <p><?php the_excerpt()?></p>
                            </div>
                            <?php endwhile;?>
                    </div>

            </section>
            <?php endif; ?>
            <?php wp_reset_query();?>
            <?php endif; ?>
        </div>
    </div>
</footer>

With a small amount of CSS:

.related-posts h3 {
    font-size: 1.2rem;
}

.related-posts h2 {
    text-decoration: underline;
}

I would like the excerpt that is displayed to be limited to 50 characters and customise the 'read more' element that shows on the front end (currently [...]). However I haven't been able to do this. Any help would be hugely appreciated!

2 Answers 2

0

You can use the get_the_excerpt filter to modify what's printed by the_excerpt():

add_filter( 'get_the_excerpt', 'wpse_367505_excerpt' );
function wpse_367505_excerpt( $excerpt ) {
    return substr( $excerpt, 0, 50 ) . ' [Read More]';
}

You can change the [Read More] text to whatever you'd like.

Add this code to your theme's functions.php file, and it should automatically filter your excerpts anywhere you use them.

1
  • Thank you Pat - this has worked perfectly for me. Really appreciate it!
    – DHazeel
    Commented May 25, 2020 at 17:35
1

You can use following code. Replace

<p><?php the_excerpt()?></p>

with

<p><?php echo wp_trim_words( get_the_excerpt(), 40, '...' ); ?></p>
3
  • 2
    wp_trim_words() will trim to a given number of words, which can be handy in some cases; the OP wanted to trim to a certain number of characters instead.
    – Pat J
    Commented May 26, 2020 at 1:26
  • Thank you all the same - this is helpful to know too.
    – DHazeel
    Commented May 26, 2020 at 18:48
  • Nice work! clean and simple solution :) Commented Jun 19, 2023 at 19:34

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.