Według statystyk 35% stron widzialnej części Internetu zostało zbudowanych w oparciu o Wordpress. Każdego miesiąca słowo “wordpress” wyszukiwane jest około 2.8 miliarda razy. W jednym z najpopularniejszych sklepów z szablonami do Wordpress’a możemy wybierać spośród ponad 11 000 theme’ów.

Siłą Wordpress według mnie są 4 rzeczy:

• ma bardzo prosty i intuicyjny panel administracyjny - o wiele prostszy niż Drupal czy Joomla,

• jest bardzo elastyczny i łatwo rozszerzalny poprzez zastosowanie mechanizmu hooków, akcji oraz filtrów,

• ma bardzo dużo darmowych oraz płatnych wtyczek, które ułatwiają dodawanie nowych funkcjonalności,

• użytkownik ma bardzo duży wybór darmowych oraz płatnych szablonów.

Wordpress ma też dużo minusów, ale nie chciałbym tego poruszać w tym artykule. Właściwie nie trzeba być programistą, żeby zbudować swoją stronę na Wordpress. Instalacja gotowego szablonu nie powinna być wyzwaniem. Zbudowanie własnego szablonu jest już troszkę bardziej wymagające. Dziś chciałbym rozwinąć troszkę ten temat.

Struktura katalogów

Kiedy zalogujemy się na nasz serwer do katalogu, w którym zainstalowany jest Wordpress, zobaczymy 3 główne podkatalogi: wp-admin, wp-includes oraz wp-content. Ten ostatni zawiera dwa kolejne podkatalogi: pluginsoraz themes. W pluginsznajdziemy wszystkie wtyczki, które dołączone zostały do naszej witryny. Analogicznie w  themes znajdziemy wszystkie szablony.

Co w katalogu szablonu?

Każdy szablon musi posiadać dwa pliki: index.php oraz style.css. Plik index.php jest plikiem, który będzie wczytywał widok, a zatem tam umieścimy kod naszej strony. Plik style.css to plik, który będzie zawierał ustawienia naszego szablonu. Może zawierać również style (w końcu to plik css), ale nie jest to wymagane.

Style.css

W poprzednim akapicie wspomniałem, że konfigurację naszego szablonu powinniśmy umieścić w pliku style.css. Całość konfiguracji powinna być umieszczona jako komentarz na początku pliku. Każda reguła powinna być zapisana w nowej linii.

Co mogę zmienić w style.css?

Tak naprawdę całkiem sporo. Poczynając od nazwy szablonu, autora czy linków prowadzących do strony szablonu / autora, poprzez opis, licencję i wersję, a kończąc na kluczu do tłumaczeń naszych stringów lokalizacyjnych oraz tagach. Możliwości jest całkiem sporo. Przykładowy plik style.css mógłby wyglądać następująco:

Tylko dwa ostatnie wpisy nie są wymagane (Tags, Domain Path). Pozostałe należy uzupełnić.

Strony oraz wpisy

Każdy z użytkowników Wordpress’a na pewno w panelu administracyjnym zauważył dwie zakładki w menu: Strony oraz Wpisy. Wpisy są to artykuły blogowe, natomiast Strony to statyczne strony, na których możemy zaprezentować naszą ofertę, kilka słów o sobie czy też dane kontaktowe. Takie rozróżnienie pomaga rozdzielać treści - te dynamicznie tworzone, które pojawiają się z jakąś regularnością oraz te, których zawartość jest stała.

W pliku index.php moglibyśmy je odpowiednio rozróżnić korzystając z wbudowanych mechanizmów Wordpress’a, ale nie byłoby to najładniejsze rozwiązania. O wiele lepiej jest dodać dwa kolejne pliki do naszego szablonu: single.php oraz page.php. Jeżeli Wordpress będzie musiał wczytać Stronę, zacznie szukać pliku page.php, dopiero kiedy go nie znajdzie wczyta index.php. Podobnie ma się sprawa z Wpisami - tylko wówczas Wordpress poszuka pliku single.php.

Tagi, kategorie, archiwa, wyniki wyszukiwania, autor

Podobnie jak ze Stronami czy Wpisami Wordpress działa z innymi rodzajami treści, które możemy tworzyć w panelu. Każdy zasób może mieć swój własny plik, który zostanie wczytany, gdy użytkownik wyśle prośbę o konkretny dostęp.

• dla tagów: tag.php

• dla wyników wyszukiwania: search.php

• dla kategorii: category.php

• dla archiwów: archive.php

• dla strony autora: author.php

• dla strony błędu 404: 404.php

Pliki reużywalne

Większość z naszych plików będzie miała podobne początek i zakończenie. Każda strona ma przecież nagłówek i stopkę. Dodatkowo każdy plik php powinien mieć poprawną strukturę html, a zatem zgodnie z dobrymi praktykami powinien zawierać znacznik head. W tym celu możemy przygotować dla pliki: header.php oraz footer.php, które będą zawierać wspólny kod dla nagłówka oraz stopki. Aby te pliki zadziałały należy je odpowiednio wywołać. Przykładowy plik php, z wywołaniem tych plików mógłby wyglądać następująco:

Do plików reużywalnych można zaliczyć również plik comments.php, który zawierałby szablon struktury komentarzy.

wp_head() oraz wp_footer()

Ponadto istnieją dwie funkcje, które nasze szablon powinien mieć wywołane. Obie odpowiadają za umieszczenie przez Wordpress w naszych plikach wynikowych dodatkowych bibliotek, takich jak jQuery czy naszej plików css oraz js (dodanych przez functions.php). wp_head powinno znaleźć się w nagłówku, tuż przed znacznikiem zamykającym head. Natomiast wp_footerodpowiednio w stopce, tuż przed znacznikiem zamykającym body.

Mózg naszego szablonu

Serce i ciało naszego szablonu już poznaliśmy. Za całą logikę, którą nasz szablon będzie zawierał odpowiada plik functions.php. W tym pliku możemy podłączać nowe pliki css oraz js. Dodawać nowe akcje oraz filtry, pisać funkcje, które będziemy chcieli wykorzystywać w ramach naszego szablonu. Plik functions.php również za włączanie odpowiednich funkcjonalności Wordpress’a (takich jak menu) w naszym szablonie, ponieważ nie wszystkie możliwości są włączone automatycznie.

Podsumowanie

Nasz szablon już działa i zyskał już prostą strukturę. Jak widać przygotowanie własnego szablonu w Wordpress również nie należy do bardzo skomplikowanych. Oczywiście pewne bardziej zaawansowane prace będą wymagały znajomości php i wiedzy na temat szczegółów implementacyjnych Wordpressa, dlatego zachęcam do poczytania dokumentacji Wordpress’a, żeby rozwinąć swój szablon o wiele dodatkowych ciekawych funkcjonalności.