WordPress: Adjon hozzá egyéni osztályt, ha a bejegyzés ma megjelent
Ügyfeleinktől folyamatosan kapok olyan testreszabási kéréseket, amelyekre még nem is gondoltam. Nemrég volt egy ügyfelünk, aki egyéni stílust akart a közzétett bejegyzéseihez Ma hogy egyéni CSS-osztály használatával kiemelhetők legyenek. Be akarták építeni az osztályt az archív oldalakra, a keresési eredményekre és a gyermektémájuk egyetlen bejegyzésű oldalsablonjaira.
Testreszabásához a <div>
osztályt egy WordPress-sablonban az alapján, hogy a bejegyzés ma íródott-e, használhatja PHP és a WordPress sabloncímkéket a sablonfájlban. Íme egy példa, hogyan érheti el ezt:
<?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>
Ebben a kódrészletben összehasonlítjuk a bejegyzés dátumát ($post_date
) az aktuális dátummal ($current_date
). Ha egyeznek, hozzárendelünk egy egyéni osztályt (custom-today
) hoz $custom_class
változó; ellenkező esetben üres marad. Cserélje ki 'your-existing-classes'
a meglévő osztályokkal, amelyeket meg szeretne tartani a <div>
. Adja hozzá a kívánt további osztályokat, és mentse el a sablonfájlt.
Most, amikor meglátogat egy ma írt bejegyzést, a <div>
elemnek lesz egy további osztálya custom-today
, amely lehetővé teszi, hogy a CSS használatával eltérő stílust alakítson ki. Íme egy példa:
.custom-today {
background-color: yellow;
}
Több példány a témában
Ha ezt a megközelítést több témafájlnál szeretné használni, hozzáadhat egy egyéni függvényt gyermektéma functions.php fájljához:
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');
Ezután minden sablonon belül csak hozzáadhat post_class
:
<div <?php post_class(); ?>>
<!-- Your post content goes here -->
</div>
Időzónák beépítése
A fenti példa az osztályt a WordPress-szerver ideje és időzónája alapján adja hozzá, nem a látogató ideje és időzónája alapján. Ha azt szeretné, hogy a felhasználó időzónája szerepeljen… tessék:
<?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>
A gyorsítótárazás hatással lehet a várt viselkedésre dinamikus funkciók, például elemek testreszabása az aktuális dátum vagy a látogató időzónája alapján. A gyorsítótárazás javítja a webhely teljesítményét azáltal, hogy a weboldalak vagy tartalom statikus verzióit tárolja, hogy gyorsabban kiszolgálja azokat. Ez azonban problémákat okozhat, ha a tartalmat dinamikusan kell frissíteni.