Blog / WordPress/ No Plugin Needed: Add a 'New' Badge to Posts Updated Since Last Visit in WordPress

No Plugin Needed: Add a 'New' Badge to Posts Updated Since Last Visit in WordPress

无需插件:在 WordPress 中为上次访问后更新的文章添加“新”标记

Overview

This tutorial explains how to add a feature to your WordPress site without using a plugin. When a visitor returns, the system will automatically add a "(New)" badge next to post titles that have been published or updated since their last visit, highlighting new content.

How It Works

The functionality is implemented in two main steps:

  1. Record Visit Time: When a user visits the site, a cookie stores a timestamp of the current visit.
  2. Compare and Mark: When displaying post titles, the post's publication date is compared to the timestamp stored in the cookie. If the post is newer than the last visit, a "(New)" badge is appended to the title.

Complete Code

Add the following code to the end of your active theme's functions.php file.

/**
 * WordPress: Mark posts updated since the visitor's last visit.
 * Adds a "(New)" badge to post titles.
 */
function Bing_lastvisit_the_title( $title, $id ) {
    // Only works in the main loop, not on singular views or pages.
    if ( ! in_the_loop() || is_singular() || get_post_type( $id ) == 'page' ) {
        return $title;
    }

    $cookiename = COOKIEHASH . '_lastvisit';

    // Check if the last-visit cookie exists.
    if ( ! isset( $_COOKIE[$cookiename] ) || empty( $_COOKIE[$cookiename] ) ) {
        return $title;
    }

    $lastvisit = (int) $_COOKIE[$cookiename]; // Last visit timestamp
    $publish_date = (int) get_post_time( 'U', true, $id ); // Post GMT timestamp

    // Add badge if post is newer than last visit.
    if ( $publish_date > $lastvisit ) {
        $title .= '(新)';
    }

    return $title;
}
add_filter( 'the_title', 'Bing_lastvisit_the_title', 12, 2 );

/**
 * Set the cookie to record visit time.
 */
function Bing_lastvisit_set_cookie() {
    // Don't set cookie in admin area.
    if ( is_admin() ) {
        return;
    }

    $current = current_time( 'timestamp', 1 ); // Current GMT timestamp
    $cookiename = COOKIEHASH . '_lastvisit';
    $expire = time() + ( 60 * 60 * 24 * 7 ); // Cookie expires in 7 days

    // Set the cookie.
    setcookie( $cookiename, $current, $expire, COOKIEPATH, COOKIE_DOMAIN );
}
add_action( 'init', 'Bing_lastvisit_set_cookie' );

Code Explanation

1. The Title Filter Function: Bing_lastvisit_the_title

  • Parameter Checks: Ensures the function only runs in the main loop, not on single posts/pages, and excludes the 'page' post type.
  • Cookie Check: Verifies the existence of the [COOKIEHASH]_lastvisit cookie.
  • Time Comparison: Compares the post's GMT publication timestamp with the last visit timestamp from the cookie.
  • Add Badge: Appends the "(New)" text to the title if the post is newer.

2. The Cookie Setter Function: Bing_lastvisit_set_cookie

  • Admin Exclusion: Prevents setting the cookie in the WordPress admin area.
  • Get Time: Uses current_time('timestamp', 1) to get the current GMT timestamp, important for sites in multiple time zones.
  • Set Cookie: Sets a cookie with a 7-day expiration, recording the visit time.

Notes & Customization

  • Cache Compatibility: This feature may not work with full-page caching (e.g., WP Rocket, W3 Total Cache) as cached pages don't execute PHP per user. You may need to use your cache plugin's exclusion or dynamic content features.
  • Badge Styling: The default badge is plain text "(New)". You can style it with CSS or modify the code to output an HTML element with a class for more control.
  • Expiration Adjustment: The cookie expiration is set to 7 days. You can change the 60 * 60 * 24 * 7 value as needed.
  • Post Types: The code excludes the 'page' post type by default. Modify the condition get_post_type( $id ) == 'page' to include or exclude other custom post types.

Summary

By adding these two simple code snippets, you can implement a lightweight "new post" notification feature for your WordPress site. This method requires no additional plugins, reduces server load, and offers high customization flexibility. Always back up your theme files before editing, or use a child theme.

Post a Comment

Your email will not be published. Required fields are marked with *.