WordPress.org (Polski)

Języki: বাংলা • English • Español • 日本語 한국어 • Português do Brasil • Русский • 中文 (简体) •中文 (繁體) • (Dodaj język)

Ten artykuł dotyczy tworzenia motywów WordPress. Jeśli chcesz dowiedzieć się więcej na temat instalowania i używania motywów, zapoznaj się z tematem Korzystanie z motywów. Ten temat różni się od korzystania z motywów, ponieważ omawia techniczne aspekty pisania kodu do tworzenia własnych motywów, a nie jak aktywować motywy lub gdzie można uzyskać nowe motywy.

Dlaczego motywy WordPress

Motywy WordPress to pliki, które współpracują ze sobą aby stworzyć projekt i funkcjonalność witryny WordPress. Każdy motyw może być inny, oferując właścicielom witryn wiele możliwości natychmiastowej zmiany wyglądu witryny.

Możesz chcieć opracować motywy WordPress na własny użytek, np. projekt klienta lub przesłanie do katalogu motywów WordPress. Dlaczego jeszcze miałbyś tworzyć motyw WordPress?

  • Aby stworzyć niepowtarzalny wygląd dla Twojej witryny WordPress.
  • Aby skorzystać z szablonów, tagów szablonów i pętli WordPress do generowania różnych wyników i wyglądu witryny.
  • Aby zapewnić alternatywne szablony dla określonych funkcji witryny, takie jako strony kategorii i strony wyników wyszukiwania.
  • Aby szybko przełączać się między dwoma układami witryn lub skorzystać z przełącznika motywu lub stylu, aby umożliwić właścicielom witryn zmianę wyglądu witryny.

Motyw WordPress ma również wiele zalet.

  • Oddziela style prezentacji i pliki szablonów od plików systemowych, dzięki czemu witryna zostanie zaktualizowana bez drastycznych zmian w wizualnej prezentacji witryny.
  • Pozwala na dostosowanie funkcjonalności witryny unikalnej dla tego motywu.
  • Umożliwia szybkie zmiany wyglądu i układu witryny WordPress.
  • Eliminuje potrzebę, aby typowy właściciel witryny WordPress musiał uczyć się CSS, HTML i PHP, aby mieć świetnie wyglądającą witrynę.

Dlaczego warto stworzyć własny motyw WordPress? To jest prawdziwe pytanie.

  • To okazja, aby dowiedzieć się więcej o CSS, HTML i PHP.
  • To okazja, aby podzielić się swoją wiedzą z CSS, HTML i PHP do pracy.
  • To kreatywne.
  • To zabawne (w większości przypadków).
  • Jeśli ją wydasz publicznie, możesz czuć się dobrze, że udostępniłeś coś i oddałeś coś społeczności WordPress (ok, chwalenie się)

Theme Development Standards

Motywy WordPress powinny być zakodowane przy użyciu następujących standardów:

  • Używaj dobrze ustrukturyzowanego, wolnego od błędów PHP i prawidłowego HTML. Zobacz Standardy kodowania WordPress.
  • Używaj czystego, prawidłowego CSS. Zobacz Kodowanie CSS Standardy.
  • Postępuj zgodnie z wytycznymi dotyczącymi projektowania i układu witryny.

Anatomia motywu

Motywy WordPress znajdują się w podkatalogach katalogu motywów WordPress (domyślnie wp-content / themes /), których nie można bezpośrednio przenieść za pomocą pliku wp-config.php. Podkatalog motywu zawiera wszystkie style motywu eet, pliki szablonów i opcjonalne pliki funkcji (functions.php), pliki JavaScript i obrazy. Na przykład motyw o nazwie „test” znajdowałby się w katalogu wp-content / themes / test /. Unikaj używania numerów w nazwie motywu, ponieważ zapobiega to wyświetlaniu go na liście dostępnych motywów.

WordPress zawiera domyślny motyw w każdej nowej instalacji. Dokładnie przyjrzyj się plikom w domyślnym motywie, aby lepiej zrozumieć, jak tworzyć własne pliki motywów.

Aby uzyskać wizualny przewodnik, zobacz tę infografikę dotyczącą anatomii motywu WordPress.

WordPress Motywy składają się zazwyczaj z trzech głównych typów plików, oprócz obrazów i plików JavaScript.

  1. Arkusz stylów o nazwie style.css, który kontroluje prezentację (projekt wizualny i układ) stron serwisu.
  2. Pliki szablonów WordPress, które kontrolują sposób, w jaki strony witryny generują informacje z bazy danych WordPress, które mają być wyświetlane w witrynie.
  3. Opcjonalny plik funkcji (functions.php) jako część plików motywów WordPress.

Przyjrzyjmy się temu indywidualnie.

Motywy potomne

Najprostszym możliwym motywem jest motyw potomny, który zawiera tylko style.css plik plus dowolne obrazy. Jest to możliwe, ponieważ jest to element podrzędny innego motywu, który działa jako jego rodzic.

Aby uzyskać szczegółowy przewodnik po motywach potomnych, zobacz Motywy potomne.

Motyw Arkusz stylów

Oprócz informacji o stylu CSS dla Twojego motywu, style.css zawiera szczegółowe informacje o motywie w postaci komentarzy. Arkusz stylów musi zawierać szczegółowe informacje o motywie w postaci komentarzy. Żadne dwa motywy nie są mogą mieć te same szczegóły wymienione w nagłówkach komentarzy, ponieważ spowoduje to problemy w oknie dialogowym wyboru motywu. Jeśli tworzysz własny motyw, kopiując istniejący, upewnij się, że najpierw zmienisz te informacje.

Poniżej znajduje się przykład pierwszych kilku wierszy arkusza stylów, zwanego nagłówkiem arkusza stylów, dla motywu „Dwadzieścia trzynaście”:

Uwaga: Nazwa autora to sugeruje, aby była taka sama, jak nazwa użytkownika na wordpress.org autora tematu, chociaż może to być również prawdziwe nazwisko autora. Wybór należy do autorów motywu.

Zwróć uwagę na listę tagów używanych do opisu motywu. Pozwalają one użytkownikowi znaleźć Twój motyw za pomocą filtra znaczników. Pełną listę można znaleźć w podręczniku przeglądu motywu .

Linie nagłówka komentarza w style.css są wymagane, aby WordPress mógł zidentyfikować motyw i wyświetlić go w panelu administracyjnym w sekcji Projekt > Motywy jako dostępna opcja motywu wraz z innymi zainstalowanymi motywami.

Wskazówki dotyczące arkuszy stylów

  • Podczas tworzenia CSS postępuj zgodnie ze standardami kodowania CSS.
  • Używaj prawidłowego CSS, gdy Jako wyjątek, użyj przedrostków specyficznych dla dostawcy, aby skorzystać z funkcji CSS3.
  • Zminimalizuj ataki CSS. Oczywistym wyjątkiem jest obsługa specyficzna dla przeglądarek, zwykle wersje IE. Jeśli to możliwe, oddzielne hacki CSS oddzielne sekcje lub oddzielne pliki.
  • 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:

  • style.css
  • index.php

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(); ?></body></html>

Indeks (index.php)

  • Wyświetla listę postów w postaci fragmentu lub pełnej długości. Wybierz jedną lub drugą, stosownie do potrzeb.
  • Uwzględnij wp_link_pages (), aby obsługiwać linki nawigacyjne w postach.

Archive (archive.php)

  • Wyświetl tytuł archiwum (tagi, kategorie, archiwa oparte na datach lub autorów).
  • Wyświetl listę postów w postaci fragmentów lub pełnej długości. Wybierz jedną lub drugą, stosownie do potrzeb.
  • Uwzględnij wp_link_pages (), aby obsługiwać linki nawigacyjne w postach.

Strony (page.php)

  • Wyświetl tytuł strony i zawartość strony.
  • Wyświetl listę komentarzy i formularz komentarzy (chyba, że komentarze są wyłączone).
  • Uwzględnij wp_link_pages (), aby obsługiwać linki nawigacyjne na stronie.
  • Metadane, takie jak tagi, kategorie, data i autor, nie powinny być wyświetlane.
  • Wyświetlaj link „Edytuj” dla zalogowanych użytkowników z uprawnieniami do edycji.

Pojedynczy post (single.php)

  • Uwzględnij wp_link_pages (), aby obsługiwać linki nawigacyjne w poście.
  • Wyświetl tytuł i treść posta.
    • Tytuł powinien być zwykłym tekstem, a nie linkiem wskazującym na siebie.
  • Wyświetl datę publikacji.
    • Przestrzegaj ustawień formatu daty i godziny chyba że jest to ważne dla projektu. (Ustawienia użytkownika dotyczące formatu daty i czasu znajdują się w panelach administracyjnych > Ustawienia General).
    • Aby uzyskać dane wyjściowe oparte na ustawieniach użytkownika, użyj the_time (get_option („date_format”)).
  • Wyświetl nazwisko autora (jeśli ma zastosowanie).
  • Wyświetl kategorie postów i tagi postów.
  • Wyświetl link „Edytuj” dla zalogowanych użytkowników z uprawnieniami do edycji.
  • Wyświetl listę komentarzy i formularz komentarzy.
  • Pokaż linki nawigacyjne do następnego i poprzedniego posta za pomocą opcji previous_post_link () i next_post_link ().
  • Komentarz autora powinien być podświetlony inaczej.
  • Wyświetlaj gravatary (awatary użytkowników), jeśli to konieczne.
  • Obsługuj komentarze w wątkach.
  • Wyświetlaj trackbacki / pingbacki.
  • Ten plik nie powinien zawierać definicji funkcji, chyba że zostanie sprawdzona funkcja function_exist (), aby uniknąć błędów ponownej deklaracji. Idealnie wszystkie funkcje powinny znajdować się w functions.php.

Wyniki wyszukiwania (search.php)

JavaScript

  • Kod JavaScript powinien być umieszczane w zewnętrznych plikach, gdy tylko jest to możliwe.
  • Użyj wp_enqueue_script (), aby załadować swoje skrypty.
  • JavaScript ładowany bezpośrednio do dokumentów HTML (pliki szablonów) powinien być zakodowany CDATA, aby zapobiec błędom w starszych przeglądarkach .
<script type="text/javascript">/* <!]> */</script>

Zrzut ekranu

Utwórz zrzut ekranu dla swojego motywu. Zrzut ekranu powinien mieć nazwę screenshot.png i znajdować się w katalogu najwyższego poziomu. Zrzut ekranu powinien dokładnie przedstawiać projekt motywu i być zapisany w formacie PNG. Chociaż .jpg, .jpeg i .gif są również prawidłowymi rozszerzeniami i formatami plików zrzutu ekranu, nie są one zalecane.

Zalecany rozmiar obrazu to 1200 pikseli szerokości i 900 pikseli wysokości. Zrzut ekranu będzie zwykle wyświetlany jako mniejszy, ale zbyt duży obraz umożliwia wyświetlanie w wysokiej rozdzielczości na wyświetlaczach HiDPI. Zwróć uwagę, że ponieważ ekran Zarządzaj motywami jest responsywny, góra i dół obrazu zrzutu ekranu mogą nie być widoczne, więc trzymaj grafikę blisko środka.

Opcje motywów

Motywy mogą opcjonalnie obsługiwać Motyw dostosowywania ekranu. Aby zapoznać się z przykładowym kodem, zobacz Przykładową stronę opcji motywu WordPress.

Włączając dostępność ekranu dostosowywania motywu dla roli użytkownika, użyj możliwości użytkownika „edit_theme_options” zamiast funkcji „switch_themes”, chyba że rola użytkownika powinna również mieć możliwość zmiany motywów. Zobacz więcej w sekcji Role i możliwości oraz Dodawanie menu administracyjnych.

Jeśli używasz funkcji „edit_themes” w dowolnym miejscu swojego motywu, aby uzyskać dostęp w roli administratora do ekranu dostosowywania motywu (lub może niektórych ekranów niestandardowych), należy pamiętać, że od wersji 3.0 ta funkcja nie została domyślnie przypisana do roli administratora w przypadku instalacji WordPress Multisite. Zobacz wyjaśnienie. W takim przypadku użyj możliwości „edit_theme_options”, jeśli chcesz, aby Administrator zobaczył menu „Opcje motywu”. Zobacz dodatkowe możliwości roli administratora podczas korzystania z WordPress Multisite.

Proces testowania motywu

  1. Napraw błędy PHP i WordPress. Dodaj następujące ustawienie debugowania do pliku wp-config.php, aby zobaczyć przestarzałe wywołania funkcji i inne błędy związane z WordPress: define („WP_DEBUG”, true) ;. Aby uzyskać więcej informacji, zobacz Hooked Functions Hook.
  2. Sprawdź pliki szablonów z listą kontrolną plików szablonów (patrz wyżej).
  3. Przeprowadź test za pomocą Theme Unit Test.
  4. Sprawdź poprawność HTML i CSS. Zobacz Walidacja witryny internetowej.
  5. Sprawdź błędy JavaScript.
  6. Przetestuj we wszystkich docelowych przeglądarkach. Na przykład IE9, Safari, Chrome, Opera, Firefox i Microsoft Edge.
  7. Wyczyść wszelkie zbędne komentarze, ustawienia debugowania lub elementy TODO.
  8. Zobacz temat Przegląd motywu, jeśli jesteś publicznie wydanie motywu poprzez przesłanie go do katalogu motywów.

Zasoby i referencje

Standardy kodu

  • Poznaj swoje źródła
  • Standardy kodowania WordPress
  • Standardy kodowania CSS

Projekt motywu

  • Projekt i układ witryny

CSS

  • CSS
  • Skrót CSS
  • Klasy generowane przez WordPress

Szablony

  • Wkraczanie do szablonów
  • Szablony
  • Hierarchia szablonów
  • Tagi szablonów
  • Pętla
  • Tagi warunkowe
  • Opis funkcji
  • I18n dla programistów WordPress
  • Walidacja danych

Lista funkcji

  • Dokumentacja funkcji

Testowanie i kontrola jakości

  • Część tematyczna Te st
  • Walidacja witryny internetowej
  • Naprawianie błędów CSS w przeglądarce
  • Rozwiązywanie problemów z CSS
  • modern.IE: do testowania IE na różnych platformach z otwartym -source tools

Release & Promocja

  • Proces przeglądu motywu

Write a Comment

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *