Presete Element i Grupy Opcji Presets: Wyjaśniona różnica

Co jeśli możesz stylizować całą witrynę Divi z elastycznością zajęć CSS? Postanowione system Divi umożliwia mieszanie mocy i łatwości, co zmieni sposób budowania stron internetowych. Niezależnie od tego, czy buduje jedną stronę docelową, czy witrynę wielostronicową, ustawienia wstępne pozwalają tworzyć style wielokrotnego użytku, które obniżają czas projektowania, jednocześnie zachowując konsekwentne.

W Divi 5 ustawienia wstępne i grupy opcji łączą siły, aby dostarczyć potężny, wydajny przepływ pracy. Presegowanie elementów pozwalają tworzyć pakiety projektowe dla określonych elementów, podczas gdy ustawienia grupowe opcji oferują style mieszanki i dopasowania, które działają w Twojej witrynie. Oszczędzają czas, zapewniają spójność i odblokowują nowe możliwości twórcze.

W tym poście zbadamy, jak działają, jak różnią się i jak je połączyć, aby uzyskać mądrzejszy, szybszy projekt. Do końca zobaczysz, dlaczego ustawiony system Divi jest obowiązkowy dla następnego projektu.

Co to są wstępne wstępne elementy?

Podstawowe wstępne elementy pomagają w tworzeniu spójności różnych elementów Divi. W Divi istnieją cztery powtarzające się typy elementów, które można znaleźć w całym produkcie: sekcje, wiersze, kolumny i moduły. Wprowadzone w Divi 4 i przeniesione do Divi 5, pozwalają utworzyć kompletny pakiet stylizacji dla elementu i ponownie użyć go jednym kliknięciem, bez względu na to, gdzie pracujesz na swojej stronie.

Podstawowe elementy przechwytują każde ustawienie, które zastosowałeś do jednego elementu - jak typografia modułu Blurb, kolory, odstępy i wiele innych. Na przykład, jeśli utworzyłeś moduł BLURB o określonych rozmiarach czcionek, stylizowany wygląd ikony i kolory, element wstępnie zablokowuje wszystkie te szczegóły w jednym ustawieniu ponownym użyciu.

PRETS ELEMENT można ustawić jako domyślne, więc każda nowa instancja tego elementu automatycznie dziedziczy styl wstępny. Są globalnie modyfikowalne, co oznacza, że ​​jedna poprawka do Perst aktualizuje każdą połączoną instancję w Twojej witrynie natychmiast. Jeśli chcesz zmienić ustawienie wstępne, możesz zastąpić ustawienie wstępne na poziomie elementu, co daje elastyczność bez łamania systemu. Możesz także zmodyfikować ustawienie wstępne na całym świecie, aby działał on we wszystkich przypadkach, w których był używany.

Presety elementów są idealne do oszczędzania i ponownego wykorzystania kompletnych, wypolerowanych wzorów do powtarzających się elementów. Na przykład, podczas tworzenia modułu CTA, możesz zrobić dla niego ustawienie elementu, a następnie zastosować go na wiele stron. Z ustawieniem elementu jest jednocześnie zapisany i gotowy do użycia gdziekolwiek go potrzebujesz, zapewniając spójność projektowania bez większego wysiłku.

Jakie są ustawienia o grupie opcji?

NOWOŚĆ W DIVI 5, PRESET GRUPY OPCJI PRZECIWKO SIĘ Z CAŁYCH ELEMENTÓW PROJEKTOWYCH NA WŁAŚCIWOŚĆ WŁAŚCIWOŚCI PROJEKTOWANYCH - takich jak typografia, cienie pudełkowe, granice, odstępy lub efekty przewijania. Są to bloki stylów modułowych, które można zastosować na różnych elementach, od cieni przycisków po czcionki nagłówka. Nie są związani z jednym typem elementu, co czyni je niezwykle wszechstronnymi.

Jedną z wielkich rzeczy w ustawieniach grup opcji Divi, która mocno ją wyróżnia od konkurentów, jest to, że nie koncentruje się on tylko na CSS. Zawiera także efekty zbudowane za pomocą skryptów. Możesz to zauważyć w bardziej interaktywnych funkcjach Divi, takich jak opcje warunków, filmy w tle HTML, efekty przewijania i wiele innych.

Presety grup opcji można zastosować we wszystkich typach elementów. Sekcja, wiersz, kolumna i moduł mogą dzielić ten sam ustawienia o granicy. Moduły z wbudowanymi ustawieniami przycisków mogą udostępnić ten sam przycisk wstępnie.

Podstawowe wstępne elementy w porównaniu do grupy opcji Presets: Kluczowe różnice

Podstawowe elementy służbowe służą jako zestawy projektowe typu „wszechświat, zbudowany w celu usprawnienia przepływu pracy Divi poprzez zablokowanie w każdym szczegółach jednego elementu-jak w pełni stylowy moduł nagłówku pełnej szerokości lub BLURB z jego typografią, kolorami, odstępami i efektami zawartymi w statycznym planie. Nacisk koncentruje się wąski, powiązany wyłącznie z jednym elementem, co czyni je wyróżniającymi się w duplikatowaniu złożonych, wypolerowanych wzorów w Twojej witrynie za pomocą jednego kliknięcia.

Idealnie nadają się do przyspieszenia procesu, gdy potrzebujesz spójnej sekcji CTA na pięciu stronach - stylizuj go raz, zapisz go i bez wysiłku. Chociaż oferują globalne aktualizacje i ustawienia domyślne, ich zakres jest ograniczony, zapewniając stały, gotowy pakiet, który priorytetowo traktuje spójność całego elementu.

PRESETET GRUPY OPCJI

Z drugiej strony ustawienia grupy opcji powiększają style lub zachowania wielokrotnego użytku-podobnie jak cień przycisku, style typograficzne nagłówka lub efekt przewijania-oferujący dynamiczne podejście krzyżowe, które uwolni się od pleśni pojedynczej elementu. Te ustawialne warstwy projektowania mogą dodawać spójną stylistykę do przycisków w dowolnym module, który zawiera jeden, taki jak moduł blurb, formularz kontaktowy lub e-mail moduł opt-in, stosując styl wszędzie, gdzie pasuje, z elastycznością mieszania i dopasowywania.

Błyskują, ograniczając nadmiarowość w wspólnym otoczeniu. Pozwalają raz raz zdefiniować styl nagłówka lub cień pudełka i zastosować go w całej stronie, a jednocześnie wspierając globalne edycje w czasie rzeczywistym i zastępowanie poziomu elementów. W przeciwieństwie do statycznego, wszystkiego lub nietoperza natury, ustawień grup opcji zapewniają precyzyjne stylizację i zdolność adaptacyjną w całym projekcie.

Jak używać wstępnych wstępnych elementów i ustawień grup opcji w Divi 5

Łączenie ustawień wstępnych elementów i ustawień grup opcji w Divi 5 jest jak parowanie głównego szefa kuchni z sous szefem kuchni - jeden obsługuje duży obraz, a inne nurkuje w szczegółach. Oto przewodnik krok po kroku, aby uczynić ich w harmonii:

Krok 1: Zacznij od ustawień grupowych opcji dla podstawowych stylów

Zacznij od zdefiniowania podstawowych zasad projektowania, takich jak typografia, schematy kolorów, cienie lub dynamiczne efekty, takie jak animacje przewijania. Zapisz te elementy jako ustawienia o grupie opcji i ustaw je jako domyślne. Rozpoczynając od projektu, ustawienia o grupie opcji mogą pomóc w budowie podstawy projektu witryny. Na przykład, tworząc układ nagłówka w konstruktorze motywów, możesz stworzyć wstępną grupę opcji, aby stylizować przycisk w menu, aby łatwo powtórzyć styl tego przycisku na całej stronie podczas budowania stron internetowych.

Każdy nowy element, który dodajesz i przypisuje ustawienie wstępne do dziedziczenia tych stylów automatycznie, nadając Twojej witrynie jednolity wygląd bez ciągłego poprawiania jej.

Krok 2: Zamonncowe wstępne elementy

Po utworzeniu wstępnych wstępnych elementów grup opcji możesz zbudować na swoim fundamencie projektowym, tworząc ustawienia wstępne dla swoich układów. Na przykład, jeśli chcesz mieć kilka modułów BLURB na swojej stronie głównej, musisz tylko stylizować jeden i utworzyć wstępnie ustawienia elementu. Stamtąd możesz dodać więcej blurów i zastosować wstępnie ustawione element do każdego z nich, oszczędzając mnóstwo czasu projektowania.

Krok 3: Dostosowywanie z wstępnie ustawionymi edytami

Czasami możesz zmienić ustawienie wstępne bez zmiany innych wystąpień w Twojej witrynie. Na szczęście zarówno ustawienia wstępne, jak i wstępne ustawienia grup opcji na to pozwalają. Na przykład utworzyłeś ustawienia o grupie opcji dla swoich nagłówków - od H1 do H6 - ale chcesz zmienić kolor nagłówka, którego planujesz użyć na tle obrazu. Nasze nagłówki są stylizowane jako #000000 , które nie będą działać dla tej aplikacji. Możesz edytować jedną instancję tego ustawienia bez zmiany samego ustawiania. Udaj się do zakładki projektowania modułu nagłówka i zmień kolor.

Możesz precyzyjnie edytować wstępne ustawienia elementów, takie jak przykład BLURB z poprzedniego. Jedna ikona nie jest idealnie kwadratowa, wydaje się szersza niż inne. Stosując CSS na karcie Advanced, zmiana pozostaje izolowana. Inne moduły BLURB o tym samym ustawieniu pozostają nienaruszone. Zwiększa to elastyczność projektowania, umożliwiając poprawki do poszczególnych elementów bez zmiany szerszego systemu.

Otrzymasz to, co najlepsze z obu światów, wprowadzając wstępne ustawienia elementów i ustawienia grup opcji do następnego projektu projektowania stron internetowych: Spójność całej strony z salą na wolność twórczą.

Dlaczego pracują lepiej razem

• Zwiększona wydajność projektowania: Presety grup opcji obsługują drobne szczegóły (takie jak typografia lub cienie w pudełku), podczas gdy wstępne ustawienia elementów umożliwiają wdrażanie sekcji, wierszy, kolumn lub modułów w sekundach.
• Bardziej spójny projekt: wspólne style pozostają synchronizowane za pomocą ustawień grup opcji, a ustawienia wstępne zapewniają, że układy wyglądają identycznie, gdziekolwiek są używane.
• Zachęca do skalowalności: Zmień jedną grupę opcji ustawienia (takie jak rozmiar czcionki), a każde połączone ustawienie wstępne zaktualizuje się natychmiast - idealnie dla witryn uprawnych, w których potrzebne są dodatkowe strony.
• Jest to przyszły dowód: Wskazówki dotyczące mapy drogowej Divi 5 na temat ustawień grup gniazdowania opcji wstępnych wstępnych wstępnych elementów, obiecując jeszcze ściślejszą integrację.

Przyszłość wstępnych elementów i grup opcji w Divi 5

Divi 5 już dostarcza potężny ustawiony system, ale przyszłość obiecuje jeszcze ściślejszą integrację, która mogłaby na nowo zdefiniować sposób budowania systemów projektowych: Grupa Grupy Nesting Presete Inside Element. Chociaż ta funkcja jest nadal w rozwoju, pozwoli ci tworzyć ustawienia wstępne prawie całkowicie z modułowych ustawień grup opcji, odblokowując nowy poziom globalnej kontroli projektowania.

Wyobraź sobie, że bez wysiłku tworząc w pełni zaprojektowane bludy, CTA i więcej, używając już zaprojektowanych ustawień grup opcji. Zaoszczędzi czas, ułatwi tworzenie spójnego wyglądu witryn i pozwoli ci szybciej budować strony internetowe. Ponieważ obie ustawienia wstępne działają razem, możesz kiedyś aktualizować elementy projektu w całej witrynie, a każdy połączony element natychmiast się dostosuje. To nie jest tylko przyrostowa aktualizacja; Jest to skok w kierunku prawdziwego systemu projektowego podobnego do CSS w ramach Divi's Drag-and-End Visual Builder.

Chociaż nie możemy jeszcze gniazdować ustawień wstępnych, mapa drogowa Divi 5 obejmuje je. Po przybyciu będą one ostatecznym sposobem na utworzenie systemu projektowego: zacznij od ustawień grup opcji jako bloków konstrukcyjnych, montaż ich w ustawienia wstępne w celu szybkiego wdrażania i utrzymują globalną kontrolę przy minimalnym wysiłku.

Projektuj inteligentne z ustawieniami grupowymi opcji

Postanowione system Divi 5 to nie tylko funkcja - jest to rewolucja dla projektantów stron internetowych. Presegowanie elementów i ustawienia grupowe opcji mogą wydawać się małymi narzędziami, ale przykładają cios. Presete Element pozwala oszczędzać i ponownie wykorzystać całe projekty z zerowym zamieszaniem, podczas gdy ustawienia grup opcji przynoszą elastyczność i spójność stylów i zachowań, których używasz wszędzie. Używane razem tworzą szybki, spójny i elastyczny przepływ pracy-niezależnie od tego, czy budujesz jednostronicową, czy wielostronicową witrynę e-commerce.

Prawdziwa magia dzieje się, gdy używasz ich razem. Presete grupy opcji pomagają położyć fundament solidny, a następnie budować polerowane, wielokrotne projekty z ustawieniami wstępnymi. Rezultatem jest spójna strona internetowa bez sztywności, skalowalna bez przytłaczania i wydajna bez skrawania narożników. Ten ustawiony system projektowy jest zmieniającym grę dla użytkowników Divi, odblokowując moc podobną do CSS z prostotą punktową i kliknięcia.

Przed zanurzeniem się w następnym projekcie pobierz najnowszą Alpha Divi 5, eksperymentuj z ustawieniami wstępnymi i zobacz, jak przekształcają sposób, w jaki budujesz strony internetowe Divi.