Niektóre motywy WordPress nie mają wizualnie dopracowanej części odpowiedzialnej za przejście do starszego / nowszego wpisu. Jest to ta sekcja widoczna pod szczegółami wpisu.

W zależności od motywu jaki wykorzystujemy na naszej stronie można łatwiej lub trudniej zmodyfikować te odsyłacze. Pierwszy pomysł w jaki sposób to zrobić, to zapewne zmiana funkcji, która jest odpowiedzialna za generowanie tej części kodu. Jednakże nie każdy jest w stanie sobie z tym poradzić, a nawet jeśli potrafi to zrobić to nie musi, ponieważ można prostym zabiegiem dodać klasy do odsyłaczy.

Poniżej przykład – podglądając kod strony widzimy już dodane klasy „starszy-wpis” i „nowszy-wpis”.

<nav class="navigation post-navigation">
 <h1 class="screen-reader-text">Zobacz wpisy</h1>
 <div class="nav-links">
 <a class="starszy-wpis" href="https://www.itbvega.pl/automatycznie-zmieniany-stopce-strony/" rel="prev"><span class="meta-nav">&laquo; Poprzedni wpis</span>Automatycznie zmieniany rok w stopce strony</a>
 <a class="nowszy-wpis" href="https://www.itbvega.pl/ograniczanie-ilosci-starszych-wersji-wpisow-w-wordpress/" rel="next"><span class="meta-nav">Kolejny wpis &raquo;</span>Ograniczanie ilości starszych wersji wpisów w WordPress</a>
 </div>
</nav>

Mając te klasy można dalej bawić się w stylizowanie wyglądu przy pomocy kodu CSS. Efekt końcowy może być taki:

 

Zapewne jest to nic wielkiego, można by dodać jakieś graficzne dodatki, na przykład strzałki etc. Jednakże tutaj chodziło dokładnie o takie delikatne stylizowanie. Odsyłacze zostały rozmieszczone obok siebie, a każda linia tekstu odpowiednio delikatnie sformatowana – odpowiednia wielkość i grubość czcionek oraz podkreślenie dla odsyłaczy.

W jaki sposób dodać te klasy?
W pliku functions.php należy wstawić kod:

add_filter('next_post_link', 'post_link_attributes1');
add_filter('previous_post_link', 'post_link_attributes2');

function post_link_attributes1($output) {
 $code = 'class="nowszy-wpis"';
 return str_replace('<a href=', '<a '.$code.' href=', $output);
}
function post_link_attributes2($output) {
 $code = 'class="starszy-wpis"';
 return str_replace('<a href=', '<a '.$code.' href=', $output);
}

i po sprawie 🙂

A czemu wiewiórka jako obrazek tytułowy?
Bo uwielbiam robić zdjęcia, bo kocham wiewiórki, no i trzecie bo – wiewiórki są ciekawskie.
Stare pierniki na wsiach gadały: ciekawość to pierwszy stopień do piekła. Ale to jest wielki fałsz. Ciekawość prowadzi do rozwoju, pomaga doświadczać tego świata, badać, sięgać dalej, robić kolejny krok, który z piekłem nie ma nic wspólnego. Także starym piernikom dziękujemy i robimy ciekawski krok…