Omówienie układu (Layout overview) w Magento 2

Czyli co trzeba wiedzieć i jakie koncepcje które trzeba znać, aby tworzyć układy dla niestandardowego motywu (theme) dla Magento2.

 

W Magento2 podstawowymi elementami projektowania strony są układy (layouts), pojemniki (containers) i bloki (blocks).

  1. Układ reprezentuje strukturę strony internetowej.
  2. Kontenery reprezentują symbole zastępcze w obrębie tej struktury strony.
  3. Bloki reprezentują elementy sterujące interfejsem użytkownika lub komponenty w elementach zastępczych kontenera.

 

  1. Układy (Layouts) udostępniają struktury stron internetowych przy użyciu pliku XML, który identyfikuje wszystkie pojemniki i bloki tworzące stronę.
  2. Kontenery (Containers) przydzielają strukturę treści do strony za pomocą znaczników kontenera w pliku XML układu. Kontener nie zawiera żadnych dodatkowych treści poza zawartością zawartych elementów. Przykłady kontenerów obejmują nagłówek, lewą kolumnę, główną kolumnę i stopkę.
  3. Bloki (Blocks) renderują elementy interfejsu użytkownika na stronie za pomocą znaczników bloków w pliku XML układu. Bloki korzystają z szablonów do generowania kodu HTML, który można wstawić do jego rodzica bloku konstrukcyjnego. Przykłady bloków obejmują listę kategorii, mini-koszyk, tagi produktu i listę produktów.

 

Podstawowe układy (Basic layouts)

Podstawowy widok wszystkich stron sklepu Magento jest  zdefiniowany w dwóch plikach, układu konfiguracji znajduje się w module Magento_Theme:

 

Układ definiujący strony.

<Magento_Theme_module_dir>/view/frontend/layout/default.xml :

 

Układ definiuje skrypty, obrazy i dane meta zawarte w sekcji <head> stron.

<Magento_Theme_module_dir>/view/frontend/layout/default_head_blocks.xml

Te podstawowe układy konfiguracji strony są rozszerzone w innych modułach Magento oraz w tematach Magento.

 

Uchwyty układu (Layout handles)

Uchwyt układu to unikatowy zestaw instrukcji, który służy jako nazwa pliku układu.

Istnieją trzy rodzaje uchwytów układu:

 

  • Uchwyt układu typu strony – to synonimy identyfikatorów typów stron. Odpowiada „pełnymi nazwami akcji” działań kontrolera, na przykład catalog_product_view.
  • Uchwyt układu strony – to identyfikatory poszczególnych stron. Odpowiadają akcjom kontrolera z parametrami, które identyfikują określone strony, na przykład catalog_product_view_type_simple_id_128 lub dla strony CMS, cms_page_view_id_home.xml.
  • Uchwyty arbitralne – Nie odpowiadają żadnemu typowi strony, ale inne uchwyty wykorzystują je, włączając.

 

Układanie typów plików i konwencji

Typy plików układu: według roli

Układ dla określonej strony jest definiowany przez dwa główne komponenty układu: page layout strony i page configuration strony (lub ogólny układ dla stron zwróconych w żądaniach AJAX, wiadomościach e-mail itd.).

 

Poniżej znajdują się definicje każdego typu pliku układu:

  • Układ strony (Page layout) : plik XML określający szkielet strony w sekcji <body> znacznika strony HTML, na przykład układ dwóch kolumn.
  • Konfiguracja strony (Page configuration): plik XML deklarujący szczegółową strukturę, zawartość i meta-informacje strony (zawiera sekcje <html> , <head> , <body>).
  • Ogólny układ (Generic layout): plik XML deklarujący szczegółową strukturę strony i zawartość w sekcji body znaczników strony HTML. Używane dla stron zwracanych przez żądania AJAX, wiadomości e-mail, fragmenty kodu HTML i tym podobne.

 

W tym przewodniku korzystamy z plików układu, gdy mówimy o pojęciach, które są podobnie stosowane we wszystkich typów plików układu.

 

Pliki modułów i motywów

Następujące terminy służą do rozróżniania układów dostarczanych przez różne składniki aplikacji:

  • Podstawowe układy : Pliki układów dostarczane przez moduły. Konwencjonalna lokalizacja:
    • Konfiguracja strony (Page configuration) i ogólne pliki układu: <module_dir>/view/frontend/layout
    • Pliki układu strony (Page layout):<module_dir>/view/frontend/page_layout

 

    • Układy motywów : Pliki układów dostarczane według motywów. Konwencjonalna lokalizacja:
      • Konfiguracja strony i ogólne pliki układu (Page configuration) : <theme_dir>/<Namespace>_<Module>/layout
      • Pliki układu strony (Page layout):<theme_dir>/<Namespace>_<Module>/page_layout

 

 

Przetwarzanie plików układów

Aplikacja Magento przetwarza pliki układów w następującej kolejności:

  1. Zbiera wszystkie pliki układu z modułów. Kolejność jest określona przez kolejność modułów na liście modułów z app/etc/config.php .
  2. Określa sekwencję dziedziczonych motywów [<parent_theme>, …, <parent1_theme>] <current_theme>
  3. Powtarza kolejność tematów od ostatniego przodka do bieżącego:

– Dodaje do listy wszystkie rozszerzające układ pliki.

– Zastępuje nadpisane pliki układu na liście.

  1. Scala wszystkie pliki układu z listy.

 

Sprawdzanie układu plików

Po scaleniu układów Magento sprawdza je.

Walidacje układu i obsługa błędów zależy od trybu aplikacji, w którym uruchomiona jest instancja Magento:

  • tryb programisty: składnia jest sprawdzana w plikach .xml i .xsd , a pliki .xml są sprawdzane zgodnie ze schematem xsd. Jeśli jakiekolwiek sprawdzanie poprawności zakończy się niepowodzeniem, nastąpi twarda awaria z zatrzymaniem procesu.
  • tryby produkcyjne lub domyślne: składnia jest sprawdzana w plikach .xml i .xsd . Jeśli sprawdzanie poprawności nie powiedzie się, błędy są rejestrowane w katalogu var/log bez zgłaszania wyjątku. Sprawdzanie poprawności zgodnie ze schematem XSD nie jest wykonywane.

-Author

No comments yet.

Dodaj komentarz

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