Platforma WordPress do prowadzenia blogów ( i nie tylko ) zdominowała rynek jeśli chodzi o systemy zarządzania treścią. Na uwagę zasługuje ogromna ilość wtyczek i możliwość dostosowania systemu do naszych potrzeb poprzez API i pisanie własnych pluginów.
Ten post dotyczy przede wszystkim tematu oddzielnego niezależnego formatowania ( modyfikowania ) treści postu na stronie głównej i na podstronach ( NIEZALEŻNIE OD SIEBIE ). Innymi słowy chcemy aby treść postów ( najczęściej streszczeń ) na stronie głównej była nieco inaczej sformatowana niż na podstronie z pełnym wpisem ( postem ).
Niestety w sieci dość ciężko znaleźć informacje na ten temat, pewnie dlatego, że cieżko sformułować odpowiednie zapytanie w wyszukiwarce 🙂 Bo przecież możemy mówić o niezależnym formatowaniu tej samej treści na 2 róznych stronach, ale w gruncie rzeczy chodzi przecież tylko o to aby na obu stronach ( głównej ze spisem postów i z całym postem ) skorzystać z odpowiednich znaczników html/css w zależności od tego na której aktualnie jesteśmy strony. Trochę to mgliście opisałem, dlatego trzeba się posłużyć przykładami, których oczywiście nie zabraknie 🙂
Strona główna i podstrona z postem
Strona główna w WordPressie najczęściej pokazuje spis ostatnio dodanych wpisów ( postów ). Spis to najczęściej tytuł postu i jego fragment, który kończy się wraz z zastosowaniem znacznika w naszym poście. Znacznik ten jak wiadomo określa koniec wczytywania wpisu dla strony głównej naszego bloga.
Zmiany na głównej i podstronie – NIEZALEŻNIE !
Właśnie i tutaj mamy mały problem 🙂 Co zrobić aby na stronie głównej wpis był nieco inaczej formatowany niż na podstronie z pełnym wpisem ? Można skorzystać ze styli css dla bardziej prostych zmian.
Przykłady
1) Założmy, że nasz wpis do znacznika pogrubiliśmy stosując znacznik ale NIE CHCEMY aby na stronie głównej czcionka streszczenia wpisu nie była pogrubiona. Chcemy aby cały spis postów był wypisywany bez pogrubienia fontu.
2) Bardziej wysublimowany problem, który również musiałem rozwiązać to formatowanie reklam ADSENSE.
Na stronie głównej miał być brak reklam przy streszczeniach wpisu a na stronie z wpisem reklama miała znajdować się po lewej stronie i to jeszcze z warunkiem 🙂 Jeśli na stronie z wpisem był obrazek do artykułu to kolidował on z reklamą ADSENSE ( reklama była jako blok div z float:left ). I tutaj trzeba było zmienić parametr w znaczniku obrazka z align=”alignleft na align=”alignright”
Jak sobie z tym poradzić ?
W zasadzie są różne sposoby, żeby nie komplikować opisze jeden ze sposobów, który sam musiałem zastosować. Z pomocą przychodzi API wordpressa. Warto też znać zapoznać się z filtrami w WP i podstawowymi funkcjami API tego systemu.
Konkrety
Jak odróżnić stronę główna od strony z wpisem ? Są do tego odpowiednie funkcje, np.:
is_single()
Sprawdza ona czy jesteśmy na stronie naszego wpisu ( pojedyńczego postu ) a nie na głównej. I już za pomocą tej prostej funkcji API WP możemy pewne proste rzeczy sobie we własnym zakresie załatwić. Dla przykładu, reklama adsense będzie wyświetlać się tylko na samym początku wpisu ( ale nie na streszczeniach wpisów na stronie głównej )
<?php if ( is_single() ) : ?> <div style="float:left;width:310px;"> --- TU WSTAWIAMY NASZ KOD ADSENSE ---- </div> <?php endif; ?>
Pytanie gdzie wstawić ten kod ? Musimy wstawić go do pliku content.php i to też w odpowiednim miejscu, przecież chcemy aby reklama pojawiała się na początku naszego wpisu !
W moim szablonie wstawiłem go przed funkcją the_content(), która jest odpowiedzialna za pobranie naszego wpisu z bazy danych:
<?php the_content( __( 'Continue reading <span class="meta-nav">→</span>', 'twentythirteen' ) ); ?>
Tak więc przed tym kodem wstawiamy kod z naszą reklamą ADSENSE a dzięki funkcji is_single() i warunkowi, nasza reklama nie będzie pojawiała się w każdym wpisie na stronie głównej. Nie wyglądałoby to zbyt elegancko na stronie głównej ( co za dużo to nie zdrowo ) a sama reklama będzie na stronach z pełnymi wpisami 🙂
I to tyle jeśli chodzi o proste modyfikacje.
Zaawansowane modyfikacje
Jeśli chcemy modyfikować sam wpis uwzględniając na której znajduje się stronie ( strona główna czy strona z pełnym wpisem ) to tutaj musimy skorzystać z filtrów WP ! Ogólnie rzecz biorąc filtr to funkcja WP, która rejestruje nasze własne funkcje, które wywoływane są w trakcie pobierania treści. Dzięki temu możemy w locie przetworzyć treść wpisu zanim zostanie wyświetlona na stronie lub zapisana do bazy.
W telegraficznym skróce, przykład zastosowania filtra ( dodajemy go do pliku content.php ):
add_filter('the_content', 'nasz_funkcja');
Oba argumenty tej funkcji to po prostu nazwy funkcji:
– the_content to nazwa wbudowanej funkcji, która pobiera zawartość naszego wpisu
– nasza_funkcja to funkcja, którą sami stworzyliśmy ( powinny być dołączone do pliku functions.php )
Funkcja the_content() pobiera zawartość wpisu, tego typu funkcje można dodawać do funkcji add_filter. Tego typu funkcji jest znacznie więcej. Lista funkcji, które są wykorzystywane przez mechanizm filtrowania znajduje się tutaj:
Przykłady własnych funkcji
Funkcja, która wytłuszcza czcionki na stronie wpisu ( na stronie głównej streszczenie wpisu jest bez wytłuszczenia czcionek ! )
function bold_header_post($content) { if(is_single()) { $content = '<b>'.$content; $content = preg_replace('/<span id\=\"(more\-\d+)"><\/span>/', '<span id="\1"></span></b>', $content, 1); } return $content; }
Kolejna funkcja bardziej skomplikowana służy do odpowiedniego rozstawienia reklam adsense na stronie z samym wpisem ( postem ).
Problem jaki rozwiązuje jest następujący:
– jeśli nasz wpis posiada obrazek poglądowy, który otacza tekst ( w css dla obrazka jest atrybut float:left ) a po prawej stronie mamy blok reklamy adsense to w tego typu przypadku nasz obrazek poglądowy musi zostać przesunięty do prawej krawędzi ( a więc powinien mieć float:right ).
UWAGA: w WP obrazki mają znaczniki caption i tam do pozycjonowania obrazka są argumenty: alighright, alignleft i kilka innych.
function alignment_adsense($content) { if(is_single()) { $pos = 0; $find = 'align="alignleft"'; $replace = 'align="alignright"'; if( ($pos = strpos($content, $find)) !== false ) { $content = substr_replace($content, $replace, $pos, strlen($find) ); $content = substr_replace($content, '[/caption]<div style="clear:both"></div>', strpos($content, '[/caption]'), strlen('[/caption]')); $content = str_replace('[/caption]', '[/caption]<div slyle="clear:both"></div>', $content); } } return $content; }