WordPress: wygląd (odc.1) – struktura szablonu

WordPress Zostaw komentarz

Mój blog wisi już sobie kilka tygodni i stopniowo pojawiają się nowe wpisy. Tymczasem dojrzałam do tego, by zainteresować się zmianą wyglądu strony. Standard jak to standard, mało kogo satysfakcjonuje. Ani to szczególnie ładne, ani to spersonalizowane jak należy a w dodatku standardowe, więc każdy może mieć takie samo. Cóż począć z tym fantem? Nie ma innej rady. Trzeba stworzyć własny layout.

Oczywiście można usatysfakcjonować się przerobieniem istniejącego, albo ściągnięciem gotowego z wielu dostępnych w sieci. Sprawa jest wtedy banalna. Wystarczy spędzić w sieci trochę czasu i wyszukać odpowiednią skórkę. Potem to już wystarczy skopiować ją do katalogu ‘/wp-content/themes’ aby skórka pojawiła się w spisie w zakładce [Design]->[Szaty graficzne]. Teraz już tylko wystarczy załadować upragnioną skórkę klikając na nią.

Niestety to nie w moim stylu. W myśl zasady „jak spadać to z wysokiego konia” zabieram się za rozszyfrowanie tajemnicy szablonów WordPress. Po pierwsze należy sobie uświadomić, że każda strona i blogu WordPress jest zbudowana z trzech bloków:

  • nagłówek (header)
  • treść (content)
  • stopka (footer)

Każdy z tych bloków generowany jest przez osobny skrypt wchodzący w skład skórki. Wystarczy więc edytować zawartość pliku header.php żeby wpłynąć na wygląd nagłówka oraz footer.php, żeby zmienić wygląd stopki. Pliki te znajdują się w katalogu każdej skórki.

Blok treści zawiera wszystko co znajduje się pomiędzy nagłówkiem i stopką i w zależności od sytuacji (struktura linku) generowany jest za pomocą jednego z plików:

  • home.php – panel strony głównej
  • single.php – panel pojedyńczego posta
  • page.php – panel strony typu page
  • archive.php – panel archiwum
  • category.php – panel kategorii
  • search.php – panel wyszukiwania
  • 404.php – panel błędu 404
  • comments.php – panel komentarzy
  • comments-popup.php – panel wyskakującego okna komentarzy
  • author.php – panel autora
  • date.php – panel artykułów z określonego dnia
  • sidebar.php – panel menu bocznego
  • searchform.php – panel formularza wyszukiwarki

Trzy główne bloki spinane są w jedną całość za pomocą pliku index.php i uzupełnione plikiem zawierającym style style.css.

Hierarchię plików i kolejność ich wywoływania świetnie opisuje poniższy rysunek (źródło codex):
Hierarchia plików skórki WordPress

Z tą podstawową wiedzą na temat struktury szablonu aplikacji WordPress można już się pokusić o modyfikację gotowego szablonu i przystosowanie go do swoich potrzeb. O tym jak napisać szablon od podstaw będzie następny odcinek.

Tradycyjnie na koniec pierwszego odcinka garść linków (lista jest rozwojowa, więc warto tu zaglądnąć czasem):

Poleć wpis na:

  • Facebook
  • Technorati
  • Wykop

Podobne artykuły:

  1. WordPress: wygląd (odc.6) – sidebar
  2. WordPress: wygląd (odc.5) – główny plik skórki
  3. WordPress: wygląd (odc.4) – analiza budowy standardowej stopki
  4. WordPress: wygląd (odc.3) – analiza budowy standardowego nagłówka
  5. WordPress: wygląd (odc.2) – tworzenie nowego szablonu

Komentarze (5) do “WordPress: wygląd (odc.1) – struktura szablonu”

  1. pontic Says:

    Dzisiaj tak pomyślałem, że zacznę przeglądać jak zbudowane są inne CMS-y niż joomla. Do tej pory właśnie na niej działałem. Na google natknąłem się właśnie na tą stronkę szukając budowy nowego szablonu:) I muszę powiedzieć, że fajnie to opisałeś i sensownie. Dzięki;)

  2. Aureliusz Says:

    fajny godny uwagi post – thx

  3. Stalowiec Says:

    No i nareszcie konkret do wordpress na naszym rynku blogów. Fajnie jakby pojawił się wpis o różnicy strony statycznej (html +css) a wordpressem… kwestie SEO itp ale co do tego wpisu rewelacja!!

  4. Dziewczyny WordPressa w Polsce | Wodospad kolorów Says:

    [...] szukałam w necie informacji o podstawach Tworzenia szablonów WordPressa. Dlatego u Asi polecam artykuł o strukturze szablonu WordPress. Znajdziemy tam wykaz plików składających się na stronę generowaną przez WordPressa i… [...]

  5. Marcin Says:

    Bardzo ciekawy post. Wiele przydatnych informacji. Dzięki, będę mógł wykorzystać na nowej stronie.
    Pozdrawiam

Zostaw komentarz

Silnik: Wordpress - Theme autorstwa N.Design Studio. Spolszczenie: Adam Klimowski.
RSS wpisów RSS komentarzy Zaloguj się