Ekran personalizacji motywu to moim zdaniem jedno z ciekawszych udogodnień dla użytkownika, które zostało wprowadzone w WordPressie 3.4 i od tego czasu jest stale udoskonalane. Tym wpisem rozpoczynam serię artykułów o ekranie personalizacji. Warto pamiętać, że sporo istotnych udogodnień zostało wprowadzonych niedawno w WordPressie 4.0. Zaczynamy od luźnego wprowadzenia by w kolejnych wpisach przejść do kwestii ściśle związanych z programowaniem obsługi ekranu personalizacji.
Dlaczego warto korzystać z ekranu personalizacji?
Wiele osób traktuje ekran personalizacji jako narzędzie dla początkujących użytkowników WordPressa, tymczasem jest to udogodnienie, które ma naprawdę duży potencjał i może sprawić, że:
- użytkownicy pokochają Twój motyw za możliwość łatwej konfiguracji, której efekty od razu można zobaczyć,
- testowanie motywu stanie się zdecydowanie szybsze, gdyż ekran personalizacji odświeża się dosyć często co pozwala sprawdzić szybko wszystkie opcje motywu,
- łatwo będzie można podejrzeć efekty zmian niektórych opcji, bez ich wprowadzania na stronie do czasu dobrania optymalnej konfiguracji,
- wspierając ekran personalizacji w motywie nie musimy tworzyć własnej podstrony kokpitu z opcjami – bazujemy na rozwiązaniu, które zna większość użytkowników WordPressa. Zatem nie muszą się oni od podstaw uczyć sposobu konfiguracji motywu a my nie musimy marnować czasu na implementację własnych rozwiązań.
Struktura
Ekran personalizacji motywu składa się z dwóch kluczowych elementów – panelu z ustawieniami oraz podglądu motywu. Podgląd ten jest odświeżany przy zmianach ustawień a w niektórych przypadkach opcje są modyfikowane w czasie rzeczywistym bez odświeżania strony:
Jeżeli korzystamy z małego ekranu, to dla lepszego podglądu strony możemy w każdej chwili zwinąć panel z opcjami korzystając z odpowiedniego przycisku:
Zmiany, które wprowadzamy są widoczne dopiero po zapisaniu ustawień motywu:
Co ważne – w WordPressie 4.0 wprowadzono ostrzeżenie, które pojawi się, jeżeli wprowadzimy zmiany, które nie zostały zapisane a my będziemy chcieli opuścić podgląd:
W samym panelu możemy wyróżnić kilka ważnych elementów, których hierarchia jest następująca:
Panel
Jest to od WordPressa 4.0 najwyższy w hierarchii element grupujący – zawiera własny tytuł i opis widoczny przed sekcjami:
Panele mogą znajdować się na tym samym poziomie zagnieżdżenia co sekcje – to odpowiednik katalogów, gdzie sekcje byłyby plikami. Panel możemy odróżnić od sekcji po ikonie znajdującej się z prawej strony:
Panele należy stosować wtedy, gdy chcemy zgrupować większą ilość sekcji np. możemy utworzyć panel o nazwie „Zaawansowane” a w nim dać sekcje dotyczące mediów, kodu CSS, ustawień tekstu itd.
Sekcja
Niżej w hierarchii znajduje się sekcja – odpowiada ona za grupowanie kontrolek i sama może być grupowana w panelach:
Sekcja posiada zwykle własną nazwę i opis, który odnosi się do zawartych w niej ustawień.
Kontrolka
Najniżej położonym w hierarchii elementem jest kontrolka – odpowiada ona określonej opcji motywu:
Kontrolki są grupowane w sekcjach. Od WordPressa 4.0 kontrolki podobnie jak panele i sekcje mogą mieć własny opis.
Możliwe jest też tworzenie własnych kontrolek, co oznacza w zasadzie nieograniczone pole do popisu w kwestii wyglądu i funkcji kontrolek, przy czym warto nie oddalać się w stylistyce od stylistyki kokpitu zbyt daleko.
Co warto wiedzieć?
W WordPressie 4.0 poza panelami, które znacząco porządkują opcje motywów, wprowadzono też kontekst dla kontrolek. Dzięki temu możemy pokazywać kontrolki tylko wtedy gdy podgląd pokazuje konkretną podstronę. To świetne rozwiązanie, które umożliwia zmniejszyć wyświetlaną listę opcji o parametry, które i tak nic nie zdziałają na konkretnej podstronie.
Listy paneli bocznych wyświetlanych w panelu widżetów także zależne są od tego czy dany motyw oferuje wyświetlanie danych paneli bocznych na obecnej podstronie.
Opcje motywu można zapisywać zarówno jako zwykłe opcje w tabeli options jak i ustawienia zdefiniowane według Theme Modification API. Osobiście polecam to drugie rozwiązanie, ponieważ wtedy WordPress serializuje ustawienia do postaci jednego obiektu. Nie musimy zatem implementować mechanizmu trzymania wszystkich opcji motywu w postaci jednego rekordu w bazie danych.
Jakie mamy możliwości?
Jeżeli popuścimy wodze fantazji, to możliwości są naprawdę ogromne. Przykładowe pomysły na wykorzystanie ekranu personalizacji:
- Stworzenie panelu na opcje podstron, który będzie wyświetlał parametry dedykowane dla wyświetlanej podstrony.
- Dodatkowe opcje wyświetlane przy blokach widżetów w trybie podglądu
- Kontrolka wyboru kroju pisma z bazy Google Fonts
- Podgląd zmian kolorów motywu w czasie rzeczywistym
- Komunikaty odnośnie potencjalnych błędów konfiguracji motywu wyświetlane na podglądzie
- Przewodnik „krok po kroku” po podstawowych elementach motywu przy pierwszym wyświetleniu motywu w ekranie personalizacji.
Przyszłość ekranu personalizacji motywu
Biorąc pod uwagę możliwość zintegrowania w ekranie personalizacji motywu menadżera menu, może się okazać, że za kilka wersji WordPressa strony zarządzania menu i widżetami staną się zupełnie zbędne dla większości użytkowników – dlatego warto już teraz zainteresować się bliżej tym rozwiązaniem i w miarę możliwości zintegrować je ze swoimi autorskimi motywami.