Nasz dotychczasowy szablon miał bardzo prostą formę:
<?php get_header(); ?>
<div id="container">
<div id="content">
<!-- #content, główny kontent strony -->
</div>
</div><!-- #container -->
<div id="primary" class="widget-area">
</div><!-- #primary .widget-area -->
<div id="secondary" class="widget-area">
</div><!-- #secondary -->
<?php get_footer(); ?>
Za chwilę opiszę jak uzupełnić powyższy szkielet o elementy które sprawią że stanie się on w pełni funkcjonalny.
Pętla
W drugiej części naszego cyklu pisałam o mechanizmie Pętli. Szablon index.php jest związany na trwałe z pętlą w tym sensie, że inicjuje ją i kończy. Bez obsługi pętli zaś nie ma WordPress'a. Oto najprostszy przykład implementacji pętli wewnątrz szablonu:
<?php while ( have_posts() ) : the_post() ?> <?php the_content(); ?> <?php endwhile; ?>
Pętla zaczyna się słowem kluczowym while a kończy poleceniem endwhile. Wewnątrz użyto funkcji the_content(), która pobiera treść artykułu z bazy danych i wpisuje ją w wynikowy kod html. Gdy chcemy pobrać treść artykułu do dalszej obróbki, powinniśmy użyć innej funkcji: get_the_content(). Funkcja the_content() posiada pewną ciekawą cechę. Jeśli w treści artykułu odnajdzie znacznik <!--more--> to wyświetli treść tylko do tego znacznika a dodatkowo wygeneruje hiperłącze po kliknięciu którego użytkownik będzie miał szansę zobaczyć cały artykuł. Funkcja the_content() przyjmuje parametr pozwalający określić jak wygląda taki link. Opisana funkcjonalność pozwala wyświetlić trailery kilku artykułów z przyciskami typu "czytaj dalej", warto przy tym wiedzieć, że nie zadziała ona w szablonach wyświetlających tylko jeden artykuł.
Treść artykułu powinniśmy poprzedzić jego tytułem. Aby wyświetlić tytuł możemy użyć funkcji the_title(), którą możemy wywołac w nastepujący sposób:
<?php the_title('<h1>', '</h1>'); ?>
Parametry widoczne w wywołaniu wygenerują nam kod html: <h1>Nasz tytuł</h1>. Funkcję moglibyśmy wywołać także w ten sposób:
<h1><?php the_title(); ?></h1>
a efekt końcowy byłby ten sam.
W wypadku artykułów wielostronicowych nie możemy zapomnieć o przyciskach pozwalających użytkownikowi przejść do następnej strony bądź cofnąć się do poprzedniej. Jeśli chcemy wygenerować takie linki, WordPress dostarcza nam rozwiązania jakim jest funkcja wp_link_pages(). Funkcja pozwala nam zapanować nad formą wizualną generowanych linków, wystarczy jedynie właściwie ją sparametryzować. Parametry i domyślne wartości parametrów wp_link_pages() to:
$args = array(
'before' => '<p>' . __('Pages:'),
'after' => '</p>',
'link_before' => '',
'link_after' => '',
'next_or_number' => 'number',
'nextpagelink' => __('Next page'),
'previouspagelink' => __('Previous page'),
'pagelink' => '%',
'echo' => 1
);
gdzie
- before (string) jest tekstem który zostanie umieszczony przed każdym linkiem, domyślnie: <p>Pages:
- after (string) to tekst po każdym linku, domyślnie </p>
- link_before(string) - tekst bezpośrednio przed tekstem opisującym link, domyślnie pusty
- link_after (string) - tekst bezpośrednio po tekście opisującym link, domyślnie pusty
- next_or_number (string) określa czy używane mają być numery stron, czy tez będą to linki typu "następna, poprzednia" strona Dopuszczalne wartości to:
- number (domyślnie)
- next
- nextpagelink (string) to tekst dla linku kierującego do następnej strony. domyślnie: Next page.
- previouspagelink (string) - tekst dla linku kierującego do poprzedniej strony. domyślnie: Previous page.
- pagelink (string) Łańcuch formatujący dla numerów stron. Znaki % w łańcuchu zastąpione zostaną numerami strony, stąd parametr 'Strona %' spowoduje wygenerowanie tekstu "Strona 1", "Strona 2", itd. Domyślnie: %
- more_file (string) Strona do której kierują linki. Domyślnie jest to bieżąca strona.
- echo (boolean) Przełącznik decydujący czy wynik działania funkcji ma być wpisany do strumienia wyjściowego (umieszczony w treści generowanego html) czy jedynie przypisany zmiennej. Domyślnie: 1 (tak)
W naszym przykładzie użyjemy funkcji w następujący sposób:
<?php
wp_link_pages('before=<p>&after=</p>&next_or_number=number&pagelink=Strona %');
?>
Każdy artykuł opatruje się zwykle opisującymi go atrybutami, takimi jak data wprowadzenia, autor, itp. Dane tego typu możemy wyświetlić na przykład tak:
<div class="art-meta">
<span class="author">Autor: <?php the_author_link(); ?></span>, Opublikowano:
<span class="data"><?php the_time('Y-m-d H:i:s') ?> </span>
<?php edit_post_link( "Edytuj post" ) ?>
</div>
Dane autora pobieramy funkcją the_author_link() która zwraca nam dane określone w profilu autora (np. imię i nazwisko) oraz link do jego strony domowej. Jeśli w profilu autora nie określono strony, wyświetlana jest tylko "nazwa" autora. Samą nazwę autora moglibysmy też pobraą funkcją the_author(), jednakowoż uważam, że zastosowanie funkcji the_author_link() jest bardziej eleganckie.
Datę utworzenia artykułu pobrano funkcją the_time() z parametrami formatującymi datę. Otrzymana data będzie miała format RRRR-mm-dd HH-mm-ss.
Funkcja edit_post_link() informuje silnik WordPress, że w trybie edycji ma zostać wyświetlony link opisany tekstem 'Edytuj', który zalogowanemu autorowi pozwoli przejść bezpośrednio do edycji artykułu.
Kiedy już wyświetlimy nasz artykuł, możemy zająć się innymi elementami głównego obszaru strony. Czasami na blogach widzimy linki do poprzedniego czy następnego posta. Nic nie stoi na przeszkodzie, aby w treści naszej strony umieścić podobny mechanizm. Wystarczy w tym celu użyć predefiniowanych funkcji next_posts_link() i previous_posts_link() umieszczając je w wybranym miejscu kodu strony.
Tym samym kod naszego szablonu przybierze postać:
<?php get_header(); ?>
<div id="container"><!-- #container -->
<div id="content"> <!-- #content, główny kontent strony -->
<?php while ( have_posts() ) : the_post() ?>
<?php the_title('<h1>', '</h1>'); ?>
<div class="art-meta">
<span class="author">Autor: <?php the_author_link(); ?></span>, Opublikowano:
<span class="data"><?php the_time('Y-m-d H:i:s') ?> </span>
<?php edit_post_link( "Edytuj post" ) ?>
</div>
<?php the_content(); ?>
<div class="link-pages">
<?php wp_link_pages('before=<p>&after=</p>&next_or_number=number&pagelink=Strona %'); ?>
</div>
<?php endwhile; ?>
</div> <!-- #content, główny kontent strony -->
</div><!-- #container -->
<div id="primary" class="widget-area">
</div><!-- #primary .widget-area -->
<div id="secondary" class="widget-area">
</div><!-- #secondary -->
<?php get_footer(); ?>
W ciele szablonu index.php umieściliśmy poprzednio także wywołania funkcji które ładują nam nagłówek oraz stopkę. Wydaje się, że zapomnieliśmy o bocznych paskach które będziemy wyświetlać na naszej stronie. Czas najwyższy naprawić to zaniedbanie. Użyjemy w tym celu funkcji get_sidebar(). Ale to już w kolejnym odcinku naszej serii ...
Brak komentarzy:
Prześlij komentarz