Jak korzystać z narzędzia do tworzenia nagłówków, stopek i układów kolumn Avada

Nasz własny kreator stron, Avada Builder, jest teraz dostępny w dwóch interfejsach: Avada Builder, który jest naszym narzędziem do tworzenia stron szkieletowych na zapleczu, i Avada Live, naszym narzędziem do tworzenia stron front-end, który został wprowadzony dopiero niedawno w Avadzie 6.0 .

Korzystając z naszego prostego systemu kontenerów, kolumn i elementów, obie wersje Avada Builder umożliwiają łatwe projektowanie pięknych układów stron dla Twojej witryny. Avada Builder to fantastyczne narzędzie zarówno dla współczesnych projektantów stron internetowych, jak i właścicieli witryn, ponieważ zapewnia im pełną kontrolę nad wszystkimi aspektami zawartości i układu strony. Obie wersje Avada Builder również generują ten sam kod. Są całkowicie wymienne, dzięki czemu możesz mieć to, co najlepsze z obu światów, dzięki Avada Builder, który jest obecnie dostępny.

Na stronie Kreatora Układów znajdziesz wszystkie swoje Układy i Układy Warunkowe, które możesz chcieć zbudować oprócz Układu Globalnego utworzonego domyślnie. W tym miejscu znajduje się również obszar, w którym przypisujesz sekcje układu do swoich układów i określasz warunki, aby układy warunkowe zaczęły obowiązywać.

Dostęp do Kreatora układów można uzyskać z panelu Avada Dashboard, wybierając opcję Układy > Kreator układów z menu rozwijanego. Jednym z najprostszych sposobów opisania układów jest stwierdzenie, że są to kontenery zawierające cztery sekcje układu strony – sekcję nagłówka, sekcję paska tytułu strony, sekcję treści i sekcję stopki. Więcej informacji na temat różnic między sekcjami układu a układami można znaleźć w tym dokumencie: Omówienie układów i sekcji układu (PDF). Kontynuuj czytanie, aby dowiedzieć się więcej o tym, co możesz zrobić na tej stronie.

Dwie części znajdują się na samej górze strony Kreatora układu. Technika wypełniania sekcji układu w układzie globalnym lub generowania układów warunkowych jest opisana w pierwszej sekcji (wskazówka: możesz to zamknąć za pomocą X), a po prawej stronie ekranu znajduje się obszar, z którego możesz bezpośrednio utwórz nowe układy (patrz poniżej). Wpisz nazwę nowego układu, a następnie kliknij opcję Utwórz nowy układ, aby zakończyć proces. W przypadku użycia tej metody tworzony jest pusty układ; nie określono żadnych sekcji układu ani warunków.

Kiedy tworzysz układy, są one automatycznie importowane na stronę Kreatora układów. Możesz zmienić nazwę układu, klikając przycisk Zmień nazwę u góry strony. Możesz także kliknąć ikonę koła zębatego, aby ustalić warunki dla Układu, a także usunąć Układ, klikając ikonę Kosza u góry strony. Możesz także zobaczyć i przypisać kryteria, klikając na dole wszystkich układów, z wyjątkiem układu globalnego.

W obrębie każdego Układu możesz zobaczyć cztery Sekcje Układu przypisane do konkretnego Układu, po jednej dla każdego z czterech układów. W każdej Sekcji Układu zobaczysz ikonę +, która pozwoli Ci przypisać Sekcję Układu do tej sekcji Układu, gdy najedziesz na nią myszką. Masz możliwość przypisania istniejącej sekcji układu do tej sekcji lub utworzenia zupełnie nowej sekcji od podstaw.

Korzystanie z układu sekcji

W ramach Avada Layouts możesz teraz tworzyć w pełni konfigurowalne stopki dla swojej witryny internetowej, wykorzystując w tym celu wszystkie możliwości twórcze Avada Builder.

Układ stopki to sekcja układu dodana do układu. Na amp niestandardowa stopka wymaga sekcji układu stopki, którą można dodać do układu globalnego lub niestandardowego. W następnej sekcji przyjrzymy się tworzeniu sekcji niestandardowego układu stopki, ale najpierw przyjrzyjmy się przedstawianiu układów Avada.

Na pasku bocznym WordPress lub w panelu Avada wybierz Avada > Układy. Tutaj można tworzyć i zarządzać układami i sekcjami układów Avady. Jak pokazano poniżej, Układ Globalny jest początkowo pusty i nie ma powiązanych z nim Sekcji Układu.

Dostosowywanie układu

Tę sekcję można dodać do układu globalnego lub układu warunkowego i wyświetlać ją tylko w przypadku niektórych niestandardowych typów postów lub pojedynczych stron. Układ globalny już istnieje, ale najpierw musimy opracować układ warunkowy.

Na stronie Układy dodaj nazwę i kliknij opcję Utwórz nowy układ, jak pokazano poniżej.

Utwórz sekcję układu stopki, jeśli chcesz dodać ją do istniejącego układu lub układu globalnego.

Na ekranie Kreatora sekcji układu wybierz typ sekcji układu, wprowadź nazwę (w tym amp Stopka, ewentualnie stopka globalna) i kliknij Utwórz nową sekcję układu, jak pokazano poniżej.

Poniższy obraz pokazuje, jak wygenerować sekcję układu bezpośrednio z układu. Sekcje układu witryny muszą zostać dodane do układu. Początkowo istnieje po prostu układ globalny. Aby więc utworzyć globalną niestandardową stopkę, dodaj ją do tego układu. Sekcja Niestandardowy układ stopki, a następnie dodaj warunki do sekcji Niestandardowy układ stopki, aby układ wyglądał zgodnie z kryteriami.

Nie ma w tym nic złego, ale ważne jest, aby rozważyć sytuację. Jeśli Układ jest obecnie aktywny (tj. ma warunki lub jest Układem Globalnym), wszelkie nowe Sekcje Układu będą natychmiast aktywne i puste. Rozsądniej jest najpierw dodać niestandardową stopkę do układu globalnego za pośrednictwem strony Kreatora sekcji układu, a następnie dodać ją do układu globalnego.

Alternatywnie możemy dodać stopkę, nagłówek lub sekcję układu kolumny do układu warunkowego, a następnie ją utworzyć. Warunki nie są używane, dopóki nie zostaną dodane. Jak pokazano poniżej, możemy zmienić sekcję układu stopki, najeżdżając na nią kursorem i klikając ikonę edycji.

Niestandardowa edycja układu

Domyślny edytor WordPress pojawia się podczas edycji nowej sekcji układu; możesz stąd korzystać z Avada Builder lub Avada Live. Tutaj tworzone są sekcje układu niestandardowego. Aby uzyskać dodatkowe informacje, zobacz Tworzenie zawartości sekcji układu, ale w skrócie, możesz tutaj zbudować wszystko.

Twoja niestandardowa stopka może zawierać wszystko, co możesz skonstruować w Avada Builderze. Możesz mieć wiele kolumn, zdjęć itp.; Pozwala to na ogromną elastyczność. W sekcji Układ pojawi się materiał stopki. Materiał pochodzi od Konstruktora, a jedynym ograniczeniem jest Twoja kreatywność.

Zobacz poniżej oryginalną stopkę zbudowaną dla wersji demonstracyjnej taksówki; Dokonano tego poprzez zmianę opcji motywu i widżetów stopki.

Tutaj pokazana jest wersja tego nagłówka niestandardowego na komputery stacjonarne, ale aby poprawnie zrozumieć zakres tego nagłówka niestandardowego, musisz odwiedzić aktywną witrynę, do której możesz uzyskać dostęp tutaj.

Warunkowy projekt układu

Brak warunków w układzie globalnym. Dodanie do niego sekcji układu będzie używane na każdej stronie, ponieważ ma charakter globalny. Jeśli potrzebujesz niestandardowej stopki tylko na niektórych stronach swojej witryny, np. w pojedynczych artykułach na blogu, musisz zastosować układ warunkowy.

Układ warunkowy może zawierać tylko istniejące sekcje układu. Następnie na karcie Wybierz stopkę układu przewiń do opcji Istniejące, gdzie możesz dodać sekcję Układ, jak pokazano poniżej.

Należy ustawić warunki dla każdego układu warunkowego. Układ jest aktywny po określeniu warunków; dlatego jeśli zrobisz to przed utworzeniem Sekcji Układu, strony spełniające warunki będą puste.

Aby dodać warunek, wybierz opcję Dodaj warunek z dolnego menu Układu. Pojawi się okno dialogowe, jak pokazano poniżej. Aby uzyskać więcej informacji na temat układów warunkowych, zobacz Omówienie układów warunkowych, ale w tym amp wybraliśmy opcję Wszystkie posty na karcie Warunki postów, jak pokazano poniżej.

Dodawanie kolumn z kreatora układów Avada

Element kolumny, podobnie jak element kontenera, jest niezbędnym elementem konstrukcyjnym podczas projektowania witryny Avada.

Dodawanie kolumn jest stosunkowo łatwe dzięki kreatorowi Avada Layout.

  • Kliknij przycisk „ + Kontener ”, aby dodać kontener do strony. Podczas wstawiania kontenera zostaniesz poproszony o wybranie kolumny lub układu kolumn. Możesz utworzyć pusty kontener, ale zwykle na tym etapie dodajesz kolumny.
  • Aby dodać nowe kolumny do istniejącego kontenera, najedź kursorem na kontener i kliknij przycisk „ + Kolumna ”. Aby dodać nową kolumnę kliknij tutaj.
  • W lewym górnym rogu kolumny kliknij ikonę „Zmień rozmiar kolumny”. Będzie teraz miała taki sam rozmiar jak Twoja kolumna. Na przykład amp 1/4 będzie wyświetlana jako „1/4 ” w opcji Zmień rozmiar kolumny.
  • Przeciągnij i upuść kolumny, aby zmienić ich rozmieszczenie. Możesz także przeciągać i upuszczać kolumny do kontenerów.

Kolumnę można umieścić tylko wewnątrz elementu kontenera o tej samej szerokości; Zwykle jest to szerokość witryny ustawiona dla witryny. Zatem jeśli ustawisz szerokość witryny na 1200 pikseli, kolumna 1/2 będzie miała szerokość 600 pikseli. Wstępnie ustawione rozmiary kolumn są pokazane poniżej po dodaniu do strony.

W Avadzie możesz oddzielnie ustawić szerokość kolumn (i więcej) w dużych, średnich i małych układach. Jak ustawić kolejność wyświetlania i rozmiar kolumn w układach responsywnych, wyjaśniono, jak korzystać z tej doskonałej nowej funkcji w przypadku kolumn.

Niestandardowe szerokości znajdują się w obszarze Kolumny > Projekt > Szerokość . Jak pokazano poniżej, użycie wartości procentowej umożliwia określenie szerokości niestandardowej. Zatem pozycjonowanie jest nieograniczone

Auto to nowa opcja szerokości. Zamiast o stałej szerokości, Kolumna zajmie miejsce najważniejszego w niej Elementu. Więc to działa tylko w niektórych przypadkach. Możesz zmienić kolumnę nadrzędną na Auto, a rozmiar kolumny zmieni się na szerokość elementu.

Avada dodaje także responsywne zestawy opcji dla kontenerów i kolumn. Na zapleczu Kreatora możesz zobaczyć ikony responsywności w dowolnych kolumnach, jak widać na obrazku poniżej. Kreator front-endu wyświetla ikony responsywności w opcjach.

Tylko nowe kontenery Flex pokazują zestawy opcji responsywnych. Kolumny w starszych kontenerach nie są dostępne.

Wniosek

Dzięki Avada Layouts możliwość tworzenia niestandardowej stopki, nagłówka i dodawania kolumn jest teraz rzeczywistością i niemal nieograniczoną opcją. Możesz nie tylko wykorzystać moc Avada Builder do skonstruowania praktycznie dowolnej stopki lub nagłówka, jaką możesz sobie wyobrazić, ale możesz także wykorzystać moc układów warunkowych, aby pokazać lub ukryć je na dowolnej stronie, kategorii, niestandardowym typie postu lub dowolnej kombinacji kryteria, o których możesz pomyśleć przy użyciu Avada Builder.

Jeśli chodzi o układy WordPress, Avada Layouts zmienia zasady gry w najbardziej dosłownym tego słowa znaczeniu. Fakt, że pozwala na taką swobodę projektowania i elastyczność wdrażania, oznacza, że ​​proces tworzenia Stopek już nigdy nie będzie taki sam.

Hansona F.

Ostatnie posty

Jak używać nagłówków i stopek w Elementorze

Nagłówki i stopki witryny internetowej są niezbędnymi elementami. W większości przypadków nagłówek zapewnia nawigację…

6 stycznia 2022 r

Porównanie motywów WordPress: Astra vs OceanWP

Dwa najpopularniejsze motywy WordPress na rynku to Astra i OceanWP. Profesjonalny…

2 stycznia 2022 r

Porównanie motywów wiadomości WordPress: Gazeta kontra Astra

Stworzenie doskonałej witryny z wiadomościami nie wymaga zostania projektantem stron internetowych. My…

25 października 2021 r

Utwórz witrynę internetową związaną z wiadomościami za pomocą motywu gazety

Motyw gazety jest jednym z najważniejszych motywów WordPress zaprojektowanych przez tagDiv, firmę…

18 października 2021 r

Jak zbudować eCommerce za pomocą kreatora Avada WooCommerce

Jeśli chodzi o konfigurację sklepu internetowego, WooCommerce jest najczęściej wybieraną plugin . To…

4 października 2021 r

Jak używać lepkiego nagłówka i efektów przewijania w Elementorze

Nagłówek jest zazwyczaj pierwszą rzeczą, którą widzi osoba odwiedzająca Twoją witrynę…

21 września 2021 r