Własny wygląd podstrony, strony w motywie WordPress

Każdy użytkownik WordPress do spersonalizowania wyglądu strony wykosztuje różne motywy niekiedy jednak nie są one wystarczające i trzeba stworzyć własny lub zmodyfikować posiadany.

O tym jak zbudować własny motyw dowiesz się z wpisu
Budujemy własny motyw

Dlatego też w tym wpisie pokaże jak zmodyfikować istniejący już motyw poprzez dodanie nowego szablonu strony. Jest to dosyć proste i nie wymaga sporej wiedzy.

Metody na zmianę wyglądu podstrony

Można to zrobić na 2 sposoby, poprzez stworzenie nowego pliku z zmodyfikowanym kodem lub wprowadzić modyfikacje do istniejącego pliku.

Pierwsza metoda personalizowania motywu – tworzymy własny szablon strony:

Kopiujemy istniejący plik page.php z aktualnie używanego motywu i nadajemy mu niepowtarzalną nazwę. Następnie w kopi (nowym pliku) wprowadzamy niezbędne zmiany takie jak np. dodanie dodatkowych pól lub inne poprawki jakie chcemy wprowadzić. W efekcie uzyskany szablon strony będzie się różnić od oryginalnego – warto przy tym pamiętać by nie usuwać istotnych elementów struktury tak by nowy typ strony/podstrony wpasował się w aktualny szablon. Trzeba również pamiętać o dopisaniu przed znacznik

get_header();

poniższego kodu gdzie „Produkty” to nazwa nowego szablonu

<?php
/**
* Template Name: Produkty
*/
?>

Gotowy plik wgrywamy na serwer FTP. Od tego momentu w zakładce strony podczas edycji tekstu będziemy mogli wybrać pomiędzy nowym szablonem a starym. Szablonów tego typu w jednym motywie może być kilka.

UWAGA: Mało prawdopodobne by wszystko z plikiem było dobrze za pierwszym razem, mogą pojawiać się błędy. Czasami trzeba nawet kilkakrotnie modyfikować plik nim będzie poprawnie działał.

Personalizacja szablonu strony  <- rozwinięcie poprzedniej:

Modyfikuję istniejącą stronę!

To średnio udany pomysł – o ile nie jesteśmy autorem motywu! Jest tak dlatego, że wszystkie nasze zmiany zostaną usunięte podczas aktualizacji motywu.

Ustawianie warunków w szablonie

W tej metodzie modyfikujemy istniejący szablon czyli wprowadzamy zmiany w pliku page.php lub naszym nowym pliku, który przygotowaliśmy wcześniej (podobne zmiany można wprowadzić w innych plikach).

Przed zaczęciem tej pracy warto poznać kilka zmiennych:

  • is_front_page() – odnosi się do strony głównej
  • is_page( 'About’ ) – odnosi się do strony noszącej nazwę 'About’,
  • is_page(11) – odnosi się do strony posiadającej id 11,
  • is_page( array( 42, 'about-me’, 'Contact’ ) ) – odnosi się do stron, które mają ID 42, nazywają się 'about me’ lub 'contact’

Dzięki tym zmiennym oraz kilku innym (np. is_home()) można w PHP napisać warunki dzięki, którym określona treść wyświetli się tylko po spełnieniu określonych warunków np.

if ( is_front_page() ) {
    get_header( 'home' );
} elseif ( is_page( 'About' ) ) {
    get_header( 'about' );
} else {
    get_header();
}

W ten sposób, możemy korzystać z jednego szablonu i uzyskać inny wygląd strony.

W zamieszczonym powyżej przykładzie kodu w zależności czy jest to strona główna, o nazwie About czy inna posiadamy 3 różne nagłówki. I tak:

  • get_header( 'home’ ) to plik o nazwie header-home.php

get_header( 'about’ ) to plik o nazwie header-about.php

Dla tych podstron o ile będą używały naszego szablonu standardowy header.php zostanie zastąpiony innym. Na waszej stronie może to oczywiście inaczej wyglądać i dotyczyć np. klasy, która ma zostać dodana w określonym przypadku.

Po modyfikacji zastępujemy plik stary plik nowym.

Jak skorzystać z nowego szablonu?!

W celu użycia nowego szablonu wchodzimy w panelu administracyjnym strony i wybieramy interesujący nas szablon.

wybór szablonu strony
wybór  szablonu strony

Podsumowanie

Obie metody wymagają pewnej wiedzy programistycznej i trzeba je łączyć w celu uzyskania jak najbardziej funkcjonalnego szablonu. Część niezbędnych informacji można samodzielnie wyszukać, ale i tak w większości trzeba wprowadzać zmiany na przemian z testowaniem.

Dodatkowe tagi:
własny wygląd, typ podstrony
jak wykonać skórkę dla strony
Jak uzyskać inny wygląd podstrony w WordPressie