WordPress: додайте спеціальний клас, якщо публікація була опублікована сьогодні
Я постійно отримую запити від наших клієнтів на налаштування, про які я навіть не думав. Нещодавно у нас був клієнт, який хотів опублікувати власний стиль для своїх публікацій сьогодні щоб їх можна було виділити за допомогою спеціального класу CSS. Вони хотіли включити клас до сторінок архіву, результатів пошуку та шаблонів окремих сторінок дописів своєї дочірньої теми.
Щоб налаштувати <div>
класу в шаблоні WordPress на основі того, чи було написано публікацію сьогодні, ви можете використовувати PHP та WordPress теги шаблону у вашому файлі шаблону. Ось приклад того, як ви можете досягти цього:
<?php
// Get the current post's date
$post_date = get_the_date('Y-m-d');
// Get today's date
$current_date = date('Y-m-d');
// Check if the post was written today
if ($post_date === $current_date) {
$today_class = 'custom-today';
} else {
$today_class = '';
}
?>
<div class="your-existing-classes <?php echo $today_class; ?>">
<!-- Your post content goes here -->
</div>
У цьому фрагменті коду ми порівнюємо дату публікації ($post_date
) з поточною датою ($current_date
). Якщо вони збігаються, ми призначаємо спеціальний клас (custom-today
) до $custom_class
змінна; інакше він залишається порожнім. Замінити 'your-existing-classes'
з існуючими класами, які ви хочете зберегти <div>
. Додайте додаткові класи та збережіть файл шаблону.
Тепер, коли ви відвідуєте публікацію, написану сьогодні, <div>
елемент матиме додатковий клас custom-today
, що дозволяє вам змінювати його стилі за допомогою CSS. Ось приклад:
.custom-today {
background-color: yellow;
}
Кілька екземплярів у вашій темі
Якщо ви хочете застосувати цей підхід до кількох файлів теми, ви можете додати спеціальну функцію до файлу functions.php дочірньої теми:
function add_custom_class_based_on_date($classes) {
// Get the current post's date
$post_date = get_the_date('Y-m-d');
// Get today's date
$current_date = date('Y-m-d');
// Check if the post was written today
if ($post_date === $current_date) {
$classes[] = 'custom-today';
}
return $classes;
}
add_filter('post_class', 'add_custom_class_based_on_date');
Потім у кожному шаблоні ви можете просто додати post_class
:
<div <?php post_class(); ?>>
<!-- Your post content goes here -->
</div>
Включення часових поясів
Наведений вище приклад додає клас на основі часу та часового поясу вашого сервера WordPress, а не часу та часового поясу відвідувача. Якщо ви хочете включити часовий пояс користувача… ось що:
<?php
// Get the current post's date and convert it to the visitor'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 post date and the current date based on timezones
$timezone_offset = $current_date_timezone_offset - $post_date_timezone_offset;
// Adjust the post date by the timezone offset
$post_date_adjusted = date('Y-m-d', strtotime($post_date) + $timezone_offset);
// Check if the post was written today
if ($post_date_adjusted === $current_date) {
$today_class = 'custom-today';
} else {
$today_class = '';
}
?>
<div class="your-existing-classes <?php echo $today_class; ?>">
<!-- Your post content goes here -->
</div>
Кешування може вплинути на очікувану поведінку під час впровадження динамічних функцій, як-от налаштування елементів на основі поточної дати або часового поясу відвідувача. Кешування допомагає покращити продуктивність веб-сайту, зберігаючи статичні версії веб-сторінок або вмісту для їх більш швидкого обслуговування. Однак це може спричинити проблеми, коли вміст потрібно динамічно оновлювати.