How can I show the actual content of Posts page because the_content() is showing all blog content?

Question

In Settings>Reading I have the following static page set

• Homepage: Welcome to blurr (front-page.php)
• Posts page: Blog Posts (home.php)

I'm trying to get the_content of the Blog Posts to show

• the_title(): Blog Posts
• the_content(): Read our blurr articles

But instead of showing Read our blurr articles it's showing the content of the blog posts.

Below is a screenshot for reference of the issue. I currently have two blog posts, and as you can see, their content is shown below the Blog Posts title.

I think there's a different way to get the actual content of the Blog Posts page, because in my code I use single_post_title(''); to get "Blog Posts" as the title. If I use the_title() it will show the title of the second post "Why do we use it?". Is there like single_post_content();?

<h1><?php single_post_title(''); ?></h1>
<p>
<?php
    if (have_posts()):
        while (have_posts()) : the_post();
            $content = get_the_content(); 
            echo wp_filter_nohtml_kses( $content );
        endwhile;
    else:
        echo '<p>Oops! Something went wrong</p>';
endif;
?></p>

<?php 
// the query
$wpb_all_query = new WP_Query(array('post_type'=>'post', 'post_status'=>'publish', 'posts_per_page'=>-1)); ?>

<?php if ( $wpb_all_query->have_posts() ) : ?>

<ul>
    <!-- the loop -->
    <div>
        <?php while ( $wpb_all_query->have_posts() ) : $wpb_all_query->the_post(); ?>
            <li>
                <img src="<?php the_post_thumbnail_url(); ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>">
                <div>
                    <h4><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h4>
                </div>
            </li>
        <?php endwhile; ?>
        <!-- end of the loop -->
    </div>
</ul>
<?php wp_reset_postdata(); ?>

Answer 1

You can use:

1. get_queried_object_id() to get the ID of the static posts Page. Alternatively, you may also use get_option( 'page_for_posts' ).

   $post_id = get_queried_object_id();
   //$post_id = get_option( 'page_for_posts' ); // you should use the above on the blog page
   $content = get_the_content( null, false, $post_id );
   

2. get_queried_object() to get the full data of the static posts Page. (You'd get an object just as the one returned by get_post().)

   $post = get_queried_object();
   $content = get_the_content( null, false, $post ); // or you could use $post->post_content
   

And on the posts page, the global $wp_query (the main query) already contains the latest/blog posts, so there is no need to make a secondary query like the $wpb_all_query in your code. Just use the main loop to display the posts and you can use the pre_get_posts hook to alter the main query, e.g. to change the number of posts queried per page.

So your home.php template could be as simple as:

<?php get_header(); ?>

<h1><?php single_post_title(); ?></h1>

<?php
// Display the content of the static posts Page.
// This is just an example using setup_postdata().
$post = get_queried_object();
setup_postdata( $post );
the_content();
wp_reset_postdata();
?>

<?php
// Display the latest/blog posts.
if ( have_posts() ) :
    while ( have_posts() ) : the_post(); ?>
        <h2><?php the_title(); ?></h2>
    <?php
    endwhile;
endif;
?>

<?php get_footer(); ?>