Wszystkie możliwe elementy HTML powinny być stylizowane przez Twój motyw (chyba że jest to motyw potomny), zarówno w treści postu / strony, jak i
- Tabele, podpisy, obrazy, listy, cytaty, itd.
Dodanie stylów przyjaznych do druku jest wysoce zalecane.
- Możesz dołączyć arkusz stylów drukowania z wartością media = „print” lub dodać blok mediów drukowanych do głównego arkusza stylów.
Plik funkcji
Motyw może opcjonalnie używać pliku funkcji, który znajduje się w podkatalogu motywu i nosi nazwę functions.php. Ten plik działa w zasadzie jak wtyczka, a jeśli jest obecny w motywie, którego używasz, jest automatycznie ładowany podczas inicjalizacji WordPress (zarówno dla stron administratora, jak i stron zewnętrznych). Sugerowane zastosowania tego pliku:
- Umieść w kolejce arkusze stylów motywów i skrypty. Zobacz wp_enqueue_scripts.
- Włącz funkcje motywu, takie jak paski boczne, menu nawigacyjne, miniatury postów, formaty postów, niestandardowe nagłówki, niestandardowe tła i inne.
- Zdefiniuj funkcje używane w kilku plikach szablonów motyw.
- Skonfiguruj menu opcji, podając właścicielom witryn opcje dotyczące kolorów, stylów i innych aspektów motywu.
Domyślny motyw WordPress zawiera funkcje. php, który definiuje wiele z tych funkcji, więc możesz chcieć użyć go jako modelu. Ponieważ functions.php zasadniczo działa jako wtyczka, lista Function_Reference jest najlepszym miejscem, aby uzyskać więcej informacji na temat tego, co można zrobić z tym plikiem.
Uwaga dotycząca decydowania, kiedy dodać funkcje do functions.php lub do określonej wtyczki: może się okazać, że potrzebujesz tej samej funkcji, aby była dostępna dla więcej niż jednego motywu nadrzędnego. W takim przypadku funkcja powinna zostać utworzona we wtyczce zamiast w functions.php dla określonego motywu. Może to obejmować tagi szablonów i inne określone funkcje. Funkcje zawarte we wtyczkach będą widoczne dla wszystkich motywów.
Pliki szablonów
Szablony są plikami źródłowymi PHP używanymi do generowania stron żądanych przez odwiedzających i są wyświetlane jako HTML. Pliki szablonów składają się z tagów szablonów HTML, PHP i WordPress.
Spójrzmy na różne szablony, które można zdefiniować jako część motywu.
WordPress umożliwia zdefiniowanie osobnych szablonów dla różnych aspektów witryny. Nie jest to istotne jest jednak, aby wszystkie te różne pliki szablonów w witrynie w pełni funkcjonowały. Szablony są wybierane i generowane na podstawie hierarchii szablonów, w zależności od tego, jakie szablony są dostępne w danym motywie.
Jako motyw programistą, możesz wybrać stopień dostosowania, które chcesz zaimplementować za pomocą szablonów. Na przykład w skrajnym przypadku możesz użyć tylko jednego pliku szablonu o nazwie index.php jako szablonu dla wszystkich stron generowanych i wyświetlanych przez witrynę. bardziej powszechnym zastosowaniem jest to, że różne pliki szablonów generują różne wyniki, aby umożliwić maksymalne dostosowanie.
Lista plików szablonów
Oto lista plików motywów rozpoznawanych przez WordPress. Oczywiście, Twój motyw może zawierać inne arkusze stylów, obrazy lub pliki. Pamiętaj tylko, że rozszerzenie poniższe mają specjalne znaczenie dla WordPressa – zobacz Hierarchia szablonów, aby uzyskać więcej informacji.
style.css Główny arkusz stylów. Musi być dołączony do motywu i musi zawierać nagłówek informacyjny motywu. rtl.css Arkusz stylów rtl. Zostanie to dodane automatycznie, jeśli kierunek tekstu na stronie jest od prawej do lewej. Można to wygenerować za pomocą wtyczki RTLer. Index.php Główny szablon. Jeśli Twój motyw zapewnia własne szablony, musi być obecny plik index.php. comments.php Szablon komentarzy front-page.php Szablon strony głównej home.php Szablon strony domowej, która jest domyślnie stroną główną.Jeśli używasz statycznej strony tytułowej, jest to szablon strony z najnowszymi postami. single.php Szablon pojedynczego posta. Używane w przypadku zapytania o pojedynczy wpis. W przypadku tego i wszystkich innych szablonów zapytań, index.php jest używany, jeśli szablon zapytania nie jest obecny. single- {post-type} .php Szablon pojedynczego posta używany, gdy odpytywany jest pojedynczy post z niestandardowego typu posta. Na przykład plik single-book.php byłby używany do wyświetlania pojedynczych postów z niestandardowego typu o nazwie „książka”. index.php jest używany, jeśli nie ma szablonu zapytania dla niestandardowego typu postu. page.php Szablon strony. Używane, gdy zapytanie dotyczy pojedynczej strony. category.php Szablon kategorii. Używane w przypadku zapytania o kategorię. tag.php Szablon tagu. Używane, gdy następuje zapytanie o tag. taxonomy.php Szablon terminu. Używane w przypadku zapytania o termin w taksonomii niestandardowej. author.php Szablon autora. Używane, gdy pyta się autora. date.php Szablon daty / czasu. Używane w przypadku zapytania o datę lub godzinę. Rok, miesiąc, dzień, godzina, minuta, sekunda. archive.php Szablon archiwum. Używane w przypadku zapytania o kategorię, autora lub datę. Zauważ, że ten szablon zostanie zastąpiony przez category.php, author.php i date.php dla ich odpowiednich typów zapytań. search.php Szablon wyników wyszukiwania. Używane podczas wyszukiwania. załącznik.php Szablon załącznika. Używane podczas przeglądania pojedynczego załącznika. image.php Szablon załącznika obrazu. Używane podczas przeglądania pojedynczego załącznika obrazu. Jeśli nie jest obecny, zostanie użyty załącznik.php. 404.php Szablon 404 Not Found. Używane, gdy WordPress nie może znaleźć posta lub strony pasującej do zapytania.
Te pliki mają specjalne znaczenie w odniesieniu do WordPressa, ponieważ są używane jako zamiennik dla index.php, jeśli są dostępne, zgodnie z hierarchią szablonów i gdy odpowiedni tag warunkowy zwraca wartość true. Na przykład, jeśli wyświetlany jest tylko jeden post, funkcja is_single () zwraca „true”, a jeśli w aktywnym motywie znajduje się plik single.php, ten szablon jest używany do generowania strony.
Podstawowe szablony
Motyw WordPress składa się co najmniej z dwóch plików:
Oba te pliki trafiają do katalogu Theme. Plik szablonu index.php jest bardzo elastyczny. Można go użyć do uwzględnienia wszystkich odniesień do nagłówka, paska bocznego, stopki, treści, kategorii, archiwów, wyszukiwania, błędów i wszelkich innych stron utworzonych w WordPress.
Lub można go podzielić na szablon modułowy pliki, z których każdy bierze na siebie część pracy. Jeśli nie dostarczysz innych plików szablonów, WordPress może mieć domyślne pliki lub funkcje do wykonywania swoich zadań. Na przykład, jeśli nie dostarczysz pliku szablonu searchform.php, WordPress ma domyślną funkcję wyświetlania formularza wyszukiwania.
Typowe pliki szablonów obejmują:
- komentarze. php
- comments-popup.php
- footer.php
- header.php
- sidebar.php
Używając tych plików szablonów, możesz umieścić tagi szablonów w głównym pliku index.php, aby dołączyć te inne pliki tam, gdzie mają się pojawić na końcowej wygenerowanej stronie.
Oto przykład obejmują użycie:
<?php get_sidebar(); ?><?php get_footer(); ?>
Domyślne pliki dla niektórych funkcji szablonów mogą być przestarzałe lub nieobecne i powinieneś dostarczyć te pliki w swoim motywie. Od wersji 3.0 wycofane pliki domyślne znajdują się w wp-includes/theme-compat. Na przykład, powinieneś podać header.php, aby funkcja get_header () działała bezpiecznie, i comments.php dla funkcji comments_template ().
Aby dowiedzieć się więcej o tym, jak działają te różne szablony i jak generować różne informacje w nich zawarte, przeczytaj dokumentację szablonów.
Niestandardowe szablony stron
Pliki definiujące każdy szablon strony znajdują się w katalogu Themes. Aby utworzyć nowy niestandardowy szablon strony dla strony, musisz utworzyć plik. Nazwijmy nasz szablon pierwszej strony dla naszej strony snarfer.php. Na górze pliku snarfer.php umieść następującą treść:
<?php/*Template Name: Snarfer*/?>
Powyższe kod definiuje ten plik snarfer.php jako szablon „Snarfer”. Oczywiście „Snarfer” można zastąpić dowolnym tekstem, aby zmienić nazwę szablonu strony. Ta nazwa szablonu pojawi się w edytorze motywów jako łącze do edycji tego plik.
Plik może mieć prawie dowolną nazwę z rozszerzeniem .php (zobacz zarezerwowane nazwy plików motywów dla nazw plików, których nie powinieneś używać; są to specjalne nazwy plików, które WordPress rezerwuje do określonych celów).
To, co następuje po powyższych pięciu wierszach kodu, zależy od Ciebie. Pozostała część kodu, który napiszesz, będzie kontrolować sposób wyświetlania stron korzystających z szablonu strony Snarfer. Opis różnych funkcji szablonu WordPress można znaleźć w temacie Tagi szablonów możesz użyć do tego celu. Wygodniejsze może być skopiowanie innego szablonu (np. page.php lub index.php) do snarfer.php, a następnie dodaj powyższe pięć wierszy kodu na początku pliku.W ten sposób będziesz musiał tylko zmienić kod HTML i PHP, zamiast tworzyć wszystko od zera. Przykłady przedstawiono poniżej. Po utworzeniu szablonu strony i umieszczeniu go w katalogu motywu, będzie on dostępny do wyboru podczas tworzenia lub edycji strony. (Uwaga: podczas tworzenia lub edytowania strony opcja Szablon strony nie pojawia się, chyba że istnieje co najmniej jeden szablon zdefiniowany w powyższy sposób.)
Pliki szablonów oparte na zapytaniach
WordPress może ładować różne szablony dla różnych typów zapytań. Można to zrobić na dwa sposoby: jako część wbudowanej hierarchii szablonów i poprzez użycie tagów warunkowych w pętli pliku szablonu.
Aby korzystać z hierarchii szablonów, musisz w zasadzie dostarczyć pliki szablonów specjalnego przeznaczenia, które zostanie automatycznie użyty do nadpisania index.php. Na przykład, jeśli Twój motyw zawiera szablon o nazwie category.php, a kategoria jest odpytywana, zamiast pliku index.php zostanie załadowana kategoria.php. Jeśli nie ma kategorii.php, index.php jest używany w zwykły sposób.
Możesz uzyskać jeszcze bardziej szczegółowe informacje w hierarchii szablonów, podając af plik o nazwie na przykład category-6.php – ten plik zostanie użyty zamiast category.php podczas generowania strony dla kategorii o numerze identyfikacyjnym 6. (Numery identyfikacyjne kategorii znajdziesz w Manage > Kategorie, jeśli jesteś zalogowany jako administrator witryny w WordPress w wersji 2.3 lub starszej. W WordPress 2.5 kolumna ID została usunięta z paneli administracyjnych. Identyfikator kategorii można znaleźć, klikając „Edytuj kategorię” i sprawdzając na pasku adresu URL wartość cat_ID. Będzie wyglądać następująco: „… Categories.php? Action = edit & cat_ID = 3″ gdzie „3” to identyfikator kategorii). Aby uzyskać bardziej szczegółowe informacje o tym, jak działa ten proces, zobacz Szablony kategorii.
Jeśli Twój motyw wymaga jeszcze większej kontroli nad używanymi plikami szablonów niż to, co jest dostępne w hierarchii szablonów, możesz użyć warunkowego Tagi. Tag warunkowy zasadniczo sprawdza, czy określony warunek jest prawdziwy w pętli WordPress, a następnie możesz załadować określony szablon lub umieścić określony tekst na ekranie, w oparciu o ten warunek.
Na przykład, aby wygenerować charakterystyczny arkusz stylów w poście znalezionym tylko w określonej kategorii, kod może wyglądać następująco:
Lub, używając zapytania, może wyglądać następująco:
<?php$post = $wp_query->post;if ( in_category( "9" ) ) { get_template_part( "single2" );} else { get_template_part( "single1" );}?>
W obu przypadkach ten przykładowy kod spowoduje użycie różnych szablonów w zależności od kategorii wyświetlanego postu. Warunki zapytania nie są ograniczone do kategorii, jednak zapoznaj się z artykułem Tagi warunkowe, aby zapoznać się ze wszystkimi opcjami.
Definiowanie niestandardowych szablonów
Do zdefiniowania można użyć systemu wtyczek WordPress dodatkowe szablony wyświetlane na podstawie Twoich własnych kryteriów niestandardowych. Tę zaawansowaną funkcję można osiągnąć za pomocą haka akcji „template_include”. Więcej informacji na temat tworzenia wtyczek można znaleźć w dokumentacji API wtyczek.
Dołączanie plików szablonów
Aby załadować inny szablon (inny niż nagłówek, pasek boczny, stopka, które mają predefiniowane dołączone polecenia, takie jak get_header ()) do szablonu, możesz użyć get_template_part (). Ułatwia to ponowne wykorzystanie sekcji kodu przez motyw.
Odwoływanie się do plików z szablonu
Odwołując się do innych plików w tym samym motywie, unikaj zapisanych na stałe identyfikatorów URI i ścieżek plików. Zamiast tego odwołuj się do identyfikatorów URI i ścieżek plików za pomocą funkcji bloginfo (): zobacz Odwoływanie się do plików z szablonu.
Zwróć uwagę, że identyfikatory URI używane w arkuszu stylów odnoszą się do arkusza stylów, a nie do strony, która odwołuje się do arkusza stylów. Na przykład, jeśli umieścisz katalog images / w swoim motywie, musisz tylko określić ten katalog względny w CSS, na przykład:
h1 { background-image: url(images/my-background.jpg);}
Hooki API wtyczki
Podczas tworzenia motywów dobrze jest pamiętać, że motyw powinien być skonfigurowany tak, aby działał dobrze z dowolnymi wtyczkami WordPress, które użytkownicy zdecydują się zainstalować. Wtyczki dodają funkcjonalność do WordPressa poprzez „Akcję Hooki ”(zobacz API wtyczek, aby uzyskać więcej informacji).
Większość hooków akcji znajduje się w podstawowym kodzie PHP WordPress, więc Twój motyw nie musi mieć żadnych specjalnych tagów, aby działały. Ale kilka akcji Haki muszą być obecne w Twoim motywie, aby wtyczki wyświetlały informacje bezpośrednio w nagłówku, stopce, pasku bocznym lub w treści strony. Oto lista specjalnych tagów szablonów Action Hook, które musisz uwzględnić:
wp_enqueue_scripts Używany w pliku funkcji motywu. Służy do ładowania zewnętrznych skryptów i arkuszy stylów. wp_head () Przechodzi w < head > motywu w nagłówku.php. Przykładowe użycie wtyczki: dodaj kod JavaScript. wp_footer () Przechodzi do footer.php, tuż przed zamykającym tagiem < / body >. Przykładowe użycie wtyczki: wstaw kod PHP, który musi zostać uruchomiony po wszystkim innym, na dole stopki.Bardzo często używany do wstawiania kodu statystyk sieciowych, takiego jak Google Analytics. wp_meta () Zwykle trafia do < li > Meta < / li > menu lub paska bocznego motywu; szablon sidebar.php. Przykładowe użycie wtyczki: dołącz obracającą się reklamę lub chmurę tagów. Comment_form () Przechodzi do comments.php bezpośrednio przed plikiem ” tag zamykający (< / div >). Przykładowe użycie wtyczki: wyświetl podgląd komentarza.
Aby zobaczyć prawdziwy przykład użycia, „znajdziesz te haczyki wtyczek zawarte w domyślnych szablonach motywów.
Interfejs API do dostosowywania motywów
Od WordPress 3.4 nowy Funkcja dostosowywania motywów jest dostępna domyślnie dla prawie wszystkich motywów WordPress. Strona administratora dostosowywania motywu jest automatycznie wypełniana opcjami, które motyw deklaruje wsparcie za pomocą add_theme_support () lub za pomocą interfejsu API ustawień i umożliwia administratorom wyświetlanie nietrwałych podglądów wprowadzanych zmian w czasie rzeczywistym.
Programiści motywów i wtyczek zainteresowani dodaniem nowych opcji do strony dostosowywania motywu powinni zapoznać się z dokumentacją dotyczącą interfejsu API dostosowywania motywu. Dodatkowe samouczki na temat interfejsu API dostosowywania motywu są dostępne w witrynie Ottopress.com.
Niezaufane dane
Powinieneś zmienić znaczenie dynamicznie generowanej zawartości w swoim motywie, zwłaszcza treści, która jest wyprowadzana do atrybutów HTML. Jak zauważono w standardach kodowania WordPress, tekst, który trafia do atrybutów, powinien być uruchamiany przez esc_attr (), lub podwójne cudzysłowy nie kończą wartości atrybutu i unieważniają XHTML i powodują problemy z bezpieczeństwem. Typowe miejsca do sprawdzenia to atrybuty title, alt i value.
Istnieje kilka specjalnych tagów szablonów dla typowych przypadków, w których Potrzeba bezpiecznego wyjścia. Jeden z takich przypadków obejmuje wyprowadzenie tytułu posta do atrybutu tytułu za pomocą metody the_title_attribute () zamiast the_title (), aby uniknąć luki w zabezpieczeniach. Oto przykład poprawnej zmiany znaczenia dla atrybutu tytułu linku do tytułu posta w przypadku korzystania z możliwego do przetłumaczenia tekstu:
<a href="<?php the_permalink(); ?>" title="<?php sprintf( __( "Permanent Link to %s", "theme-name" ), the_title_attribute( "echo=0" ) ); ?>"><?php the_title(); ?></a>
Translation Support / I18n
Aby zapewnić płynne przejście dla lokalizacji językowej, użyj funkcji i18n opartej na gettext WordPress do zawijania całego możliwego do przetłumaczenia tekstu w plikach szablonów. Ułatwia to dołączanie i tłumaczenie etykiet, tytułów i innych tekstów szablonu na bieżący język witryny. Zobacz więcej w WordPress Localization i I18n dla WordPress Developers.
Klasy motywów
Zaimplementuj następujące tagi szablonów, aby dodać atrybuty klas wygenerowane przez WordPress do elementów body, post i comment. W przypadku klas postów stosuj tylko do elementów w pętli.
- body_class ()
- post_class ()
- comment_class ()
Lista kontrolna pliku szablonu
Podczas opracowywania motywu sprawdź, czy pliki szablonów są zgodne z następującymi standardami plików szablonów.
Nagłówek dokumentu (header.php)
- Użyj właściwego DOCTYPE.
- Otwierający tag < html > powinien zawierać language_attributes ( ).
- < meta > element charset należy umieścić przed wszystkim innym, w tym < title > element.
- Użyj funkcji bloginfo (), aby ustawić meta < > zestaw znaków i elementy opisu.
- Użyj wp_title (), aby ustawić < tytuł >. Zobacz, dlaczego.
- Użyj automatycznych łączy do kanałów, aby dodać linki do kanałów.
- Dodaj wywołanie do wp_head () przed zamykającym < / head >. Wtyczki używają tego haka akcji do dodawania własnych skryptów, arkuszy stylów i innych funkcji.
- Nie łącz arkuszy stylów motywu w szablonie nagłówka. Zamiast tego użyj haka akcji wp_enqueue_scripts w funkcji motywu.
Oto przykład poprawnie sformatowanego obszaru nagłówka zgodnego z HTML5:
Menu nawigacji (header.php )
- Główna nawigacja motywu powinna obsługiwać niestandardowe menu z wp_nav_menu ().
- Menu powinny obsługiwać długie tytuły odsyłaczy i dużą liczbę elementów list. Te elementy nie powinny zakłócać projektu ani układu.
- Elementy menu podrzędnego powinny wyświetlać się poprawnie. Jeśli to możliwe, obsługuj style menu rozwijanych dla elementów podmenu. Rozwijane listy pozwalające na pokazywanie głębi menu zamiast tylko pokazywania najwyższego poziomu.
- Motyw powinien mieć jak najpełniejsze widżety. Każdy obszar w układzie, który działa jak widżet (chmura tagów, blogroll, lista kategorii) lub może akceptować widżety (pasek boczny), powinien zezwalać na widżety.
- Treść, która pojawia się domyślnie w obszarach z widżetami (zakodowana na stałe na przykład na pasku bocznym) powinien zniknąć, gdy widżety zostaną włączone w Widżetach Wygląd >.
Footer (footer.php)
- Użyj wywołania wp_footer (), aby pojawił się tuż przed zamknięciem tagu body.
<?php wp_footer();
read more