Tuesday, July 11, 2023
HomeMobile MarketingWordPress: Add A Customized Class If The Publish Was Revealed Immediately

WordPress: Add A Customized Class If The Publish Was Revealed Immediately


I’m continually getting requests from our purchasers for customizations I’ve by no means even thought-about. Just lately, we had a consumer that wished some {custom} styling for his or her posts printed as we speak in order that they might be highlighted using a {custom} CSS class. They wished to include the category on archive pages, search outcomes, and single publish web page templates of their little one theme.

To customise the <div> class in a WordPress template based mostly on whether or not the publish 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 publish's date
$post_date = get_the_date('Y-m-d');

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

// Verify if the publish 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 publish content material goes right here -->
</div>

On this code snippet, we evaluate the publish’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. Change 'your-existing-classes' with the present courses that you simply need to carry on the <div>. Add any further courses you need and save the template file.

Now, if you go to a publish that was written as we speak, the <div> component could have the extra class custom-today, permitting you to model it otherwise utilizing CSS. Right here’s an instance:

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

A number of Situations All through Your Theme

If you happen to wished to make use of this method on a number of theme recordsdata, you’ll be able to add a {custom} operate to your little one theme’s features.php file:

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

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

    // Verify if the publish 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 publish 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. If you happen to wished the consumer’s timezone included… right here you go:

<?php
// Get the present publish'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 publish date and the present date based mostly on timezones
$timezone_offset = $current_date_timezone_offset - $post_date_timezone_offset;

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

// Verify if the publish 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 publish content material goes right here -->
</div>

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

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments