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

Nasz własny kreator stron, Avada Builder, jest teraz dostępny w dwóch interfejsach: Avada Builder, który jest naszym back-endowym narzędziem do tworzenia szkieletów stron, oraz Avada Live, który jest naszym front-end builderem, który został niedawno wprowadzony wraz z Avadą 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 w witrynie. Avada Builder to fantastyczne narzędzie zarówno dla współczesnych projektantów stron internetowych, jak i właścicieli witryn, ponieważ daje im pełną kontrolę nad wszystkimi aspektami zawartości strony i układu. 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.

Strona Layout Builder to miejsce, w którym znajdziesz wszystkie swoje układy i wszelkie układy warunkowe, które możesz chcieć zbudować, oprócz domyślnego układu globalnego. Tutaj znajduje się również obszar, w którym przypisujesz sekcje układu do swoich układów i określasz warunki, aby Twoje układy warunkowe zaczęły obowiązywać.

Dostęp do Kreatora układów można uzyskać z pulpitu nawigacyjnego Avada, wybierając z menu rozwijanego Układy > Kreator układów. 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. Możesz dowiedzieć się więcej o różnicach między sekcjami układu i układami, czytając ten dokument: Zrozumienie układów i sekcji układu (PDF). Czytaj dalej, aby dowiedzieć się więcej o tym, co możesz zrobić na tej stronie.

Dwie części znajdują się na samej górze strony Layout Builder. 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 twórz nowe układy (patrz poniżej). Wpisz nazwę nowego układu, a następnie kliknij Utwórz nowy układ, aby zakończyć proces. W przypadku użycia tej metody tworzony jest pusty układ; nie określono sekcji układu ani warunków.

Podczas tworzenia układów 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 Układ można usunąć, klikając ikonę Kosza u góry strony. Możesz również zobaczyć i przypisać kryteria, klikając u dołu wszystkich układów, z wyjątkiem układu globalnego.

W każdym układzie można 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 po najechaniu na nią myszą. Masz możliwość przypisania istniejącej Sekcji Układu do tej sekcji lub stworzenia 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, wykorzystując do tego wszystkie kreatywne możliwości Avada Builder.

Układ stopki to sekcja układu dodana do układu. Dla ex amp le, stopkę klienta wymaga stopkę układ sekcji, który może być dodawany do każdej z globalnym lub niestandardowy układ. W następnej sekcji przyjrzymy się tworzeniu niestandardowej sekcji układu stopki, ale najpierw przyjrzyjmy się wprowadzaniu układów Avada.

Na pasku bocznym WordPress lub w panelu Avada Dashboard 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, bez powiązanych sekcji układu.

Dostosowywanie układu

Tę sekcję można dodać do układu globalnego lub układu warunkowego, wyświetlając tylko niektóre niestandardowe rodzaje postów lub pojedyncze strony. Układ globalny jest już obecny, ale najpierw musimy opracować układ warunkowy.

Na stronie Układy dodaj nazwę i kliknij 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 Układ Sekcja Builder, wybierz typ układ sekcji wprowadź nazwę (w tym ex amp le, stopka, ewentualnie Globalny stopka) i kliknij przycisk Utwórz nowy układ sekcji, 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ą stopkę niestandardową, dodaj ją do tego układu. Sekcja niestandardowego układu stopki, a następnie dodaj warunki do sekcji niestandardowego układu stopki, aby układ był wyświetlany zgodnie z kryteriami.

Nie ma w tym nic złego, ale ważne jest rozważenie sytuacji. Jeśli układ jest aktualnie aktywny (tj. ma warunki lub jest układem globalnym), wszelkie nowe sekcje układu będą natychmiast aktywne i puste. Bardziej sensowne jest dodanie stopki niestandardowej do układu globalnego za pośrednictwem strony Kreatora sekcji układu, a następnie dodanie jej do układu globalnego.

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

Dodawanie sekcji układu stopki do układu warunkowego

Edycja niestandardowego układu

Domyślny edytor WordPress pojawia się podczas edycji nowej sekcji układu; możesz użyć Avada Builder lub Avada Live stąd. Tutaj tworzone są niestandardowe sekcje układu. 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 Builder. Możesz mieć wiele kolumn, zdjęć itp.; Pozwala to na ogromną elastyczność. Sekcja Układ to miejsce, w którym pojawi się materiał stopki. Materiał pochodzi od Budowniczego, a jedynym ograniczeniem jest Twoja kreatywność.

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

Taxi Demo> Podstawowe stopka”src =” https://lh3.googleusercontent.com/_xzRCQdf_jBPoJv6eaW9Wx3rdXORc7Ni1945ud13b9kALKA4WdmZpeSSCTnLx-4hcwPKXGF1dl3E0qragaIr_eJ6AiBxO4AMKlY2tuxFbek-S0Z1PY3oQTE2UmjI4QzZydYbWqscpkwNbIpjTQ=s0 "> Spójrz na niestandardową globalną stopkę Avada Layouts.

Tutaj jest pokazana wersja tego niestandardowego nagłówka dla komputerów stacjonarnych, ale aby prawidłowo uchwycić zakres tego niestandardowego nagłówka, musisz odwiedzić działającą 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ż jest globalne. Jeśli stopka niestandardowa była potrzebna tylko na niektórych stronach witryny, na przykład na pojedynczych artykułach na blogu, musisz użyć układu warunkowego.

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.

Przypisywanie niestandardowej sekcji układu

Musisz ustawić warunki dla dowolnego układu warunkowego. Układ jest aktywny, gdy tylko zostaną określone warunki; dlatego jeśli zrobisz to przed utworzeniem sekcji układu, strony spełniające warunki będą puste.

Aby dodać warunek, wybierz 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 Zrozumienie układów warunkowych, ale dla tego przykładu amp opcję Wszystkie posty na karcie Warunki postów, jak pokazano poniżej.

Dodawanie kolumn z kreatora Avada Layout

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 układu kolumn lub kolumn. Możesz utworzyć pusty kontener, ale zwykle dodajesz kolumny na tym etapie.
  • 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 miał teraz 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 je zmienić. 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; Zazwyczaj jest to szerokość witryny ustawiona dla witryny. Tak więc, jeśli ustawisz szerokość witryny na 1200 pikseli, kolumna 1/2 będzie miała szerokość 600 pikseli. Wstępnie ustawione rozmiary kolumn są wyświetlane poniżej po dodaniu do strony.

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

Szerokości niestandardowe znajdują się w obszarze Kolumny > Projekt > Szerokość . Jak pokazano poniżej, użycie wartości procentowej pozwala określić szerokość niestandardową. Dzięki temu pozycjonowanie jest nieograniczone

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

Avada dodaje również responsywne zestawy opcji dla kontenerów i kolumn. Na zapleczu Konstruktora możesz zobaczyć responsywne ikony w dowolnych kolumnach, jak pokazano na poniższym obrazku. Front-End Builder wyświetla responsywne ikony na opcjach.

Tylko nowe kontenery Flex zawierają responsywne zestawy opcji. Kolumny w starszych kontenerach są niedostępne.

Wniosek

Dzięki Avada Layouts możliwość tworzenia niestandardowej stopki, nagłówka i dodawania kolumn jest teraz rzeczywistością i prawie nieograniczoną opcją. Możesz nie tylko wykorzystać moc Avada Builder do skonstruowania praktycznie dowolnej stopki lub nagłówka, ale możesz także wykorzystać moc układów warunkowych, aby pokazać lub ukryć je na dowolnej stronie, kategorii, niestandardowym typie posta lub dowolnej kombinacji kryteria, o których możesz pomyśleć, korzystając z 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 nigdy nie będzie taki sam.

Zostaw komentarz

Twoj adres e-mail nie bedzie opublikowany. Pola wymagane są oznaczone *