Bootstrap Wordpress tutorial logo

Custom-page.php czyli nasza indywidualna strona

autor: Robert

1 grudnia 2014

Opisałem już plik page.php, który jest domyślnym szablonem dla wszystkich dodawanych przez nasz stron. Ale oczywiście czasami chcemy by któraś z naszych stron wyglądała całkowicie inaczej. Służy nam do tego plik custom-page.php (WAŻNE! ten plik może mieć dowolną nazwę ale nazwa custom-page.php (niestandardowa-strona.php) jest dla nas zrozumiała, więc użyłem jej w tym kursie).

Najważniejszym elementem takiej strony jest informacja zawarta w komentarzu na początku jej kodu. Otwieramy znacznik kodu php czyli <?php, następnie otwieramy komentarz czyli /* wewnątrz którego umieszczamy tekst: Template name: Własna pojedyncza strona. Zamykamy komentarz */ oraz znacznik kodu php ?>

.

Teraz przy tworzeniu nowej strony w panelu po prawej pojawi nam się szablon o nazwie „Własna pojedyncza strona”.

Zajmijmy się teraz pozostałym kodem naszego pliku custom-page.php.

Podobnie jak w przypadku innych plików naszej templatki musimy zaimportować plik header.php odpowiedzialny za wyświetlanie naszego nagłówka. Korzystamy w tym celu z funkcji <?php get_header(); ?>

Następnie otworzymy sobie bootstrapowy kontener i jego standardową zawartość czyli divy z klasami .container, .row oraz .col-md-12. Jak widzicie, nie otwieram na tej stronie diva o szerokości 8 jak to miało miesce w przypaku pliku page.php

Tutaj podobnie jak w przypadku pojedynczego wpisu skorzystamy z The Loop, która pobierze nam tytuł strony oraz treść, którą wprowadzimy w edytorze wizualnym podczas tworzenia tej podstrony.

Otwieramy The Loop: <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>. Wewnątrz umieszczamy funkcję <?php the_title( $before = '<h3>', $after = '</h3>', $echo = true ) ?>, która wyświetli nam tytuł strony otoczony znacznikami h2. Następnie musimy pobrać treść naszej strony, służy do tego podobnie jak w przypadku postów funkcja <?php the_content(); ?>. Teraz zamykamy wszystkie elementy The loop za pomocą <?php endwhile; ?>, <?php else: ?> oraz <?php endif; ?>. Mając już wszystko co potrzebne do wyświetlenia zawartości podstrony zamykamy sobie diva z klasą .col-md-12.

Aby ta strona różniła się od tej generowanej za pomocą pliku page.php zrezygnujemy tu z panelu bocznego.

Ostatni element to pobranie naszej stopki czyli pliku footer.php za pomocą znanej wam już funkcji <?php get_footer(); ?>.

Teraz pozostaje już tylko utworzyć nową stronę, wybrać szablon „Własna pojedyncza strona”, wprowadzić jakąś treść, opublikować stronę i można ją dodać do menu albo do panelu bocznego:)

Przejdź do przykładowej strony

Komentarze: Bądź pierwszy!