WordPress 4.7 wprowadził kilka fantastycznych nowych ulepszeń do systemu szablonów CMS. Szablony zostały rozszerzone, aby objąć wszystkie formaty postów, umożliwiając programistom tworzenie bardziej zniuansowanych motywów, a jednocześnie umożliwiając właścicielom witryn łatwiejsze zarządzanie treścią.

Ale jak to działa? W tym samouczku pokażę ci, jak używać szablonów formatu posta w swoich motywach, z kilkoma prostymi przykładami.

Co to są szablony w WordPress?

Szablony to w zasadzie specjalne pliki, które mogą zmienić wygląd i działanie strony i / lub dodać funkcjonalność do witryny WordPress.

Przed wersją WordPress 4.7 szablony były dostępne tylko dla stron, dlatego nazywano je szablony stron , Jednak WordPress 4.7 rozszerzył ich zastosowanie o: wszystko format publikacji, więc w tym samouczku opowiem o modelach do ich wyznaczenia.

Atrybut pozycji

Po zapisaniu szablonów w motywie można je wybrać na stronach edycji artykułu.

Przygotowanie podłoża do korzystania z modeli

Będziemy pracować na przykładzie.

Aby to przetestować, musimy najpierw utworzyć motyw potomny. stosowanie  Dwadzieścia siedemnaście Nowy WordPress domyślnie.

Aby rozpocząć, utwórz nowy folder w katalogu motywów. Otrzymałem nazwę „cPPT” (skrót od niestandardowych szablonów postów), a następnie dodałem nowe nowe pliki: style.css et functions.php . Użyj poniższego kodu, aby skonfigurować te pliki:

/ * Temat Nazwa: niestandardowe post Type Theme Szablon Przykład URI: http://blair-jersyer.com Opis: Przykładowy motyw, który wykorzystuje niestandardowe typy post szablony Autor: Daniel Pataki Autor URI: http://blair-jersyer.com Szablon : dwadzieściaseventeen Wersja: 1.0.0 * /
<?php

add_action( 'wp_enqueue_scripts', 'cptt_assets' );
funkcja cptt_assets() {
    wp_enqueue_style('styl-nadrzędny', get_template_directory_uri(). '/style.css');
    wp_enqueue_style( 'styl podrzędny', get_stylesheet_directory_uri() . '/style.css', array( 'styl nadrzędny' ));
}

Wszyscy razem! Powinieneś teraz zobaczyć motyw potomny w sekcji Wygląd na pulpicie nawigacyjnym WordPress. Po aktywacji powinieneś zobaczyć niezmodyfikowaną wanilię, która pochodzi z motywu nadrzędnego.

Utwórz niestandardowy format postów

Zaczniemy od przetestowania systemu szablonów z niestandardowym formatem postu. Wyobraź sobie, że jesteś stworzyć stronę internetową związane z grami wideo.

Podczas pisania treści z gier wideo będziesz chciał opublikować nowe treści, które są zwięzłe, ale wystarczające, aby dostarczyć większość informacji.

Aby wizualnie odróżnić jeden od drugiego, musisz użyć dowolnej kategorii lub urządzenia. The Szablony znacznie uprościć proces.

add_action („init”, „cptt_custom_post_types”); function cptt_custom_post_types () {register_post_type ('game', array ('labels' => array ('name' => __ ('Gry wideo'), 'singular_name' => __ ('Gra wideo')), 'public' => prawda, 'has_archive' => prawda, 'obsługuje' => tablica ('tytuł', 'edytor', 'miniatura'), 'menu_icon' => 'dashicons-laptop')); }

Pominąłem niektóre etykiety i opcje, ale ten kod będzie wystarczający do celu, który chcemy osiągnąć.

Tworzenie szablonu

Szablon to zwykły plik PHP ze specjalnym komentarzem u góry, który informuje WordPress o tytule szablonu i miejscu, w którym powinien zostać użyty.

Stworzymy jeden do recenzji gier wideo.

<?php
/*
Nazwa szablonu: Recenzja gry
Typ wpisu szablonu: gra
*/

Podczas tworzenia nowego posta z grą wideo zobaczysz selektor z dwiema opcjami: „Domyślna” i „Recenzja gry”. Po wybraniu szablonu zostanie użyty kod wewnątrz szablonu.

Korzystanie z szablonu

 

Recenzja gry wideo
Aby stworzyć widok, wszystko, co zrobię, to skopiowanie z Twenty Seventeen. Tworzę plik o nazwie „template-game-review.php” z następującym kodem:
' '. __ („Poprzedni artykuł”, „dwadzieścia siedemnaście”). ' '. __ („Poprzedni”, „dwadzieścia siedem”). ' '. dwadzieściaseventeen_get_svg (tablica ('ikona' => 'strzałka w lewo')). ' % title ', 'next_text' => ' '. __ („Następny post”, „dwadzieścia siedemnaście”). ' '. __ („Następny”, „dwadzieścia siedem”). „ % title ”. dwadzieściaseventeen_get_svg (tablica ('icon' => 'arrow-right')). ' ',)); koniec; // Koniec pętli. ?>

Skopiowałem cały ten kod z „Twenty Seventeen”. Zmodyfikowałem funkcję „get_header” za pomocą parametru, aby uzyskać inny nagłówek. Zmieniłem też ustawienia Szablony „get_template_part()”, aby wyglądało to tak: „get_template_part( 'template-parts/game/content', 'review' ); ".

Następnie tworzę plik dla nagłówka, który nazywam „header-review.php” i wklejam kod z pliku „header.php” Twenty Seventeen i usuwam następujący wiersz:


Następnie utworzyłem plik „template-parts / game / content-review.php”. Wkleiłem kod z pliku „content.php” Twenty Seventeen i usunąłem kilka wierszy kodu, który nie był tak naprawdę potrzebny. Dodałem ten kod na samej górze:

Pełna recenzja wideo

Dodałem następujący kod CSS:

.site-content-contain {position: static; } # review-head {position: absolute; top: 55px; lewej: 0px; padding: 22px; Kolor #fff; szerokość: 100%; text-align: center; tło: rgba (0,0,0,0.3); } # review-head h1 {font-weight: 300; margin: 0px; padding: 0px; } # review-head small {color: rgba (255,255,255,0.5); font-weight: 500; transformacja tekstu: wielkie litery; czcionki, rozmiar: 11px; odstępy między literami: 1px}

To wszystko, czego potrzeba, aby utworzyć szablon dla niestandardowego formatu postów na WordPress. Jeśli masz jakieś pytania, nie wahaj się nas zapytać.