admin管理员组

文章数量:1336181

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!

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!

Share Improve this question asked May 25, 2020 at 15:32 DHazeelDHazeel 31 silver badge2 bronze badges
Add a comment  | 

2 Answers 2

Reset to default 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.

You can use following code. Replace

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

with

<p><?php echo wp_trim_words( get_the_excerpt(), 40, '...' ); ?></p>

本文标签: phpLimit the number of characterswords in an excerpt for a related posts section