Tworzymy widok (template) dla custom post w WordPress

W tym poradniku dowiesz się jak stworzyć widok (template) dla custom post type w WordPress. W tym poradniku pokażę jak stworzyć od początku do końca szablon dla custom post type w systemie CMS WordPress. Dzięki takiemu szablonowi mamy kontrolę nad wyświetlaniem danych w taki sposób jaki chcemy. Możemy bezproblemowo dodać style CSS dla danego template oraz stworzyć funkcjonalności jakie nas interesują.

Co będzie nam potrzebne, aby stworzyć widok (template) custom post w WordPress?

Plugin CPT UI – Custom Post Type UI – plugin potrzebny do stworzenia custom post dostępny w darmowych wtyczkach WordPress

Bierzmy się za robotę! Tworzymy widok (template) dla custom post type w WordPress.

Po zainstalowaniu wtyczki należy przejść do zakładki Add/Edit Post Types i dodać nowy typ posta, który chcemy dodać. Może być to każdy powtarzalny zbiór, który jest nam potrzebny do stworzenia strony. W moim przypadku będzie to zbiór poradników, które będą zawierały obrazek wyróżniający, tytuł oraz opis.

Pzechodzimy na sam dół formularza i zaznaczamy opcje, które nas interesują, w tym przypadku będą to tytuł, opis oraz obrazek wyróżniający. Zatwierdzamy wybór przyciskiem Add Post Type.

Na panelu bocznym WordPress’a pojawiła się nam nowa zakładka Poradniki.

Przejdźmy do dodania kilku poradników a następnie do wyświetlenia pojedynczego poradnika.

Dodałem 3 poradniki, różniące się tytułem, opisem oraz obrazkiem.

Obecnie wygląd naszego template dla custom post type Poradnik jest ustalony przez motyw z którego korzystamy – TwentyTwenty.

Załóżmy, że nie podoba nam się sposób w jaki wyświetla nam się widok Poradnika. Nie chcemy dolnej nawigacji, autora oraz daty. Aby wykluczyć to tylko w danym typie postów, należy stworzyć oddzielny plik PHP, który zajmie się obsługą danego typu posta.

Przejdź do folderu z motywami WordPress – themes. Następnie wybierz swój motyw, w naszym przypadku – twentytwenty.

Następnie należy znaleźć w folderze naszego motywu plik single.php lub w naszym przypadku singular.php i stworzyć jego kopie. Nazwa single.php lub singular.php zależy od motywu na jakim pracujemy, lecz zazwyczaj to te pliki odpowiadają za obsługę widoku pojedynczego post’a.

Nazwę kopii pliku singular.php zmieniamy na nazwę ’single-Post Type Slug.php’. Nazwę Post Type Slug nadajesz w pierwszej rubryce przy tworzeniu Custom Post Type. W naszym przypadku będzie to: ’single-poradnik.php’.

Następnie przechodzimy do edycji pliku single-poradnik.php, który zawiera kod z pliku singular.php i przystępujemy do jego modyfikacji.

<!--?php if ( have_posts() ) { while ( have_posts() ) { the_post(); get_template_part( 'template-parts/content', get_post_type() ); } } ?-->
<!-- #site-content -->
<!--?php get_template_part( 'template-parts/footer-menus-widgets' ); ?-->
<!--?php get_footer(); ?-->

Aby wyświetlić tylko to co nas interesuje należy zmodyfikować kod.
Chcemy usunąć dolną partię o najnowszych wpisach oraz wyświetlić jedynie zawartość poradnika oraz header i footer naszej strony.

<?php while ( have_posts() ) : the_post(); ?>
<h2></h2>
<?php the_content(); ?> 
<?php the_post_thumbnail( 'full' ); ?> 
<?php endwhile; ?> 
<?php get_footer(); ?>

<?php while ( have_posts() ) : the_post(); ?>

<?php the_content(); ?>

<?php the_post_thumbnail( 'full' ); ?>

<?php endwhile; ?>

<?php get_footer(); ?>

W ten sposób otrzymaliśmy widok jaki chcieliśmy uzyskać: Header / Custom Post Type Content / Footer.

Podsumowanie

Tworzenie template dla custom post type jest łatwe, natomiast ważne są szczegóły.

Postaraj się, aby poprawnie nazwać własny typ posta. Nazewnictwo musi być proste, nieskomplikowane i bez polskich znaków.
Zastanów się nad strukturą custom post type, jakich pól potrzebujesz aby poprawnie wyświetlić nowy typ posta. (Niestandardowe typy pól dla własnego typu posta, których nie ma w narzędziu CPT UI możemy zaimplementować za pomocą pluginu Custom Fields, który zaprezentuję w kolejnym poradniku.)
Pamiętaj, aby poprawnie wyświetlić zdefiniowane pola w pliku php. Ważne jest, aby zastosować pętlę while() dla pojedynczego post’a the_post(). W ten sposób prawidłowo wyświetlimy wszystkie potrzebne pola.