[Resolved] Latest Post in the header element

[Deep]

Hi,
I would like to show the latest post title (clickable) from a specific category in the header element. Please tell me how can I achieve that.
Thanks.

GeneratePress 2.2.2

GP Premium 1.7.8

[Leo]

Hi there,

Can you take a look at this and see if it helps?
https://generatepress.com/forums/topic/how-to-use-element-header-to-display-feature-image-and-title/#post-721662

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Deep]

Hi,
Thanks for your support. It is somewhat working. But let me do one favor. I want to show the post from a specific category.
And at the same time, I want to show the date of the post along with the excerpt/meta description.
Thanks.

[David]

Hi there,

so you actually want to show a single post, like they are displayed in the blog, within the Header Element?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Deep]

Hi,
See what I have achieved after following instructions in the aforementioned support link by Tom. See the screenshot:
http://prntscr.com/nfse9l
Now what I am wanting is to show the post from a specific category (post title, excerpt as well as the date). You can see the red highlights in the screenshot.
Please help me to achieve the specified design idea. Thank you.

[Tom]

Try this instead:

add_shortcode( 'most_recent_hero_post', function() {
    $latest_posts = get_posts( 'numberposts=1&category=10' );
    $latest_id = $latest_posts[0]->ID;
    $date_format = get_option( 'date_format' );
    setup_postdata( $latest_posts[0] );
    add_filter( 'excerpt_more', 'tu_no_read_more', 1000 );
    add_filter( 'excerpt_length', 'tu_change_excerpt_length', 1000 );

    $return = '<h2>' . get_the_title( $latest_id ) . '</h2>';
    $return .= '<div class="hero-date">' . get_the_date( $date_format, $latest_id ) . '</div>';
    $return .= '<div class="hero-excerpt">' . get_the_excerpt( $latest_id ) . '</div>';
    $return .= '<a class="button hero-button" href="' . get_permalink( $latest_id ) . '">Read more</a>';

    remove_filter( 'excerpt_more', 'tu_no_read_more', 1000 );
    remove_filter( 'excerpt_length', 'tu_change_excerpt_length', 1000 );

    wp_reset_postdata();

    return $return;
} );

function tu_no_read_more() {
    return '';
}

function tu_change_excerpt_length() {
    return 30;
}

Just update the 10 to the ID of the category.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Deep]

Hi,
Thanks for your support. You almost met my requirements.

Please provide the code to show the post date below the title.

You provided the code to exclude the most recent post from the actual loop:

add_filter( 'pre_get_posts', function( $query ) {
    if ( $query->is_home() && $query->is_main_query() ) {
        $query->set( 'offset', '1' );
    }
} );

Well, it may work for all categories of post. Please make it work for the specified category.

One more thing, will it be possible to hide the header element to appear on the same post page (i.e. the latest post page under the specified category). Else it will be a repetition of the post title once in the header element and on the page.

Thanks. I am looking for your help.

[Tom]

I just updated the code to include the date.

Your code to exclude the post would look like this:

add_filter( 'pre_get_posts', function( $query ) {
    if ( $query->is_category( 123 ) && $query->is_main_query() ) {
        $query->set( 'offset', '1' );
    }
} );

You’ll want to replace 123 with the ID of your category.

Not too sure what you mean re your last question. Can you explain a bit more?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Deep]

You are fantastic. I really appreciate your support.

Now coming to my last query let me show you the screenshot of the latest post page (not the archive).
http://prntscr.com/ng1nch

In the screenshot, you can see the header element and the page content are showing the same thing. Hence I want a condition like the header element will not appear on the latest (single) post page.

I mean when a viewer will be reading the latest post it is of no use to show them the information about the same post in the header element.

Hope I can make you understand my requirements. Looking forward to your support.

Thanks.

[Tom]

Hmm, so you want the latest post Header Element to display on all other single posts?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Deep]

Exactly. You got it right. I want the latest post Header Element to display on all other single posts of that category only. Say for example all other single posts under ‘News’ category.

Hope you got it. Thanks.

[Tom]

Let’s try this:

add_filter( 'generate_header_element_display', function( $display, $post_id ) {

    // Update 123 to the ID of your Header Element.
    if ( 123 === $post_id ) {
        $latest_posts = get_posts( 'numberposts=1&category=10' );
        $latest_id = $latest_posts[0]->ID;

        if ( $latest_id === get_the_ID() ) {
            $display = false;
        }
    }

    return $display;

}, 10, 2 );

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Deep]

It’s not working.

I have applied the same method to find out the post id. See the screenshot
http://prntscr.com/ngj7gr

I have applied the same id in your code and updated it. See the screenshot
http://prntscr.com/ngj8b5

Please have a look.

[Tom]

Did you update the category=10 to match the category ID you’re using?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Deep]

Hi,
I have implemented all your codes accordingly. Let me tell you that my header element id is 14305 and post category id is 6017. The codes have been updated accordingly. You can have a look.

add_shortcode( 'most_recent_hero_post', function() {
    $latest_posts = get_posts( 'numberposts=1&category=6017' );
    $latest_id = $latest_posts[0]->ID;

    $return = '<h2>' . get_the_title( $latest_id ) . '</h2>';
    $return .= '<div class="hero-date">' . get_the_date() . '</div>';
    $return .= '<div class="hero-excerpt">' . get_the_excerpt( $latest_id ) . '</div>';
    $return .= '<a class="button hero-button" href="' . get_permalink( $latest_id ) . '">Read more</a>';

    return $return;
} );

add_filter( 'generate_header_element_display', function( $display, $post_id ) {

    // Update 123 to the ID of your Header Element.
    if ( 14305 === $post_id ) {
        $latest_posts = get_posts( 'numberposts=1&category=6017' );
        $latest_id = $latest_posts[0]->ID;

        if ( $latest_id === get_the_ID() ) {
            $display = false;
        }
    }

    return $display;

}, 10, 2 );

But the problem is while on one page it showing different content than the other. Please have a look.
In the front page: http://prntscr.com/ngy9mg

In other single post pages: http://prntscr.com/ngyahx

Interestingly the header element is not visible on the post category archive too (which is unintended).

Hope things will be sorted out soon. Thanks.

[Author]

Posts