WordPress: Add A Customized Class If The Put up Was Printed At present

I’m consistently getting requests from our purchasers for customizations I’ve by no means even thought of. Just lately, we had a shopper that needed some {custom} styling for his or her posts revealed as we speak in order that they may very well be highlighted using a {custom} CSS class. They needed to include the category on archive pages, search outcomes, and single submit web page templates of their little one theme.

To customise the <div> class in a WordPress template based mostly on whether or not the submit was written as we speak, you’ll be able to make the most of PHP and WordPress template tags inside your template file. Right here’s an instance of how one can obtain this:

<?php
// Get the present submit's date
$post_date = get_the_date('Y-m-d');

// Get as we speak's date
$current_date = date('Y-m-d');

// Examine if the submit was written as we speak
if ($post_date === $current_date) {
    $today_class = 'custom-today';
} else {
    $today_class = '';
}
?>

<div class="your-existing-classes <?php echo $today_class; ?>">
    <!-- Your submit content material goes right here -->
</div>

On this code snippet, we examine the submit’s date ($post_date) with the present date ($current_date). In the event that they match, we assign a {custom} class (custom-today) to the $custom_class variable; in any other case, it stays empty. Exchange 'your-existing-classes' with the prevailing courses that you simply wish to carry on the <div>. Add any extra courses you want and save the template file.

Now, whenever you go to a submit that was written as we speak, the <div> factor may have the extra class custom-today, permitting you to fashion it in another way utilizing CSS. Right here’s an instance:

.custom-today {
background-color: yellow;
}

A number of Cases All through Your Theme

In the event you needed to make use of this strategy on a number of theme information, you’ll be able to add a {custom} operate to your little one theme’s capabilities.php file:

operate add_custom_class_based_on_date($courses) {
    // Get the present submit's date
    $post_date = get_the_date('Y-m-d');

    // Get as we speak's date
    $current_date = date('Y-m-d');

    // Examine if the submit was written as we speak
    if ($post_date === $current_date) {
        $courses[] = 'custom-today';
    }

    return $courses;
}
add_filter('post_class', 'add_custom_class_based_on_date');

Then, inside every template, you’ll be able to simply add post_class:

<div <?php post_class(); ?>>
    <!-- Your submit content material goes right here -->
</div>

Incorporating Time Zones

The above instance provides the category based mostly in your WordPress server’s time and timezone, not the customer’s time and timezone. In the event you needed the consumer’s timezone included… right here you go:

<?php
// Get the present submit's date and convert it to the customer's timezone
$post_date = get_the_date('Y-m-d');
$post_date_timezone = get_post_time('O');
$post_date_timezone_offset = substr($post_date_timezone, 0, 3) * 3600 + substr($post_date_timezone, 3, 2) * 60;

$current_date = date('Y-m-d', current_time('timestamp', false));
$current_date_timezone = get_option('timezone_string');
$current_date_timezone_offset = get_option('gmt_offset') * 3600;

// Calculate the offset between the submit date and the present date based mostly on timezones
$timezone_offset = $current_date_timezone_offset - $post_date_timezone_offset;

// Modify the submit date by the timezone offset
$post_date_adjusted = date('Y-m-d', strtotime($post_date) + $timezone_offset);

// Examine if the submit was written as we speak
if ($post_date_adjusted === $current_date) {
    $today_class = 'custom-today';
} else {
    $today_class = '';
}
?>

<div class="your-existing-classes <?php echo $today_class; ?>">
    <!-- Your submit content material goes right here -->
</div>

Caching can impression the anticipated conduct when implementing dynamic performance like customizing components based mostly on the present date or customer’s timezone. Caching helps enhance web site efficiency by storing static variations of internet pages or content material to serve them extra shortly. Nevertheless, it might trigger points when the content material must be dynamically up to date.