Wszystko, co musisz wiedzieć o grupach modułów Divi 5

Divi 5 poprawia tworzenie stron internetowych dzięki nowym funkcjom i niezrównanej elastyczności. Grupy modułów są jednym z najnowszych dodatków do Divi 5. Ta funkcja pozwala zorganizować wiele elementów w jedną, możliwą do zarządzania grupę, którą można stylizować, przenosić lub powielać za pomocą jednego kliknięcia. Ta funkcja staje się szczególnie pomocna, gdy pojawią się nadchodzące funkcje, takie jak FlexBox i pojawi się Kurent Pętli zapytań.

W tym poście zbadamy wszystko, co musisz wiedzieć o grupach modułów Divi 5. Od zrozumienia, kim są i dlaczego mają znaczenie po uczenie się, jak je skutecznie ich używać, mamy cię.

Uwaga: Divi 5 jest gotowy do użycia na nowych stronach internetowych, ale nie zalecamy jeszcze przekształcenia istniejących stron na Divi 5.

Przejrzyjmy, co jest możliwe w przypadku grup modułów.

Co to są grupy modułów?

Grupy modułów to nowy element kontenera, który pozwala na łączenie wielu modułów w jedną, spójną jednostkę w kolumnie. Po zgrupowaniu moduły mogą być stylizowane, powielane lub zmieniane razem, zwiększając przepływ pracy i zapewniając spójność w całym projekcie. Grupy modułów utrzymują stare moduły, dzięki czemu są łatwiejsze w obsłudze wspólnie.

Grupy modułów oferują znaczącą przewagę organizacyjną. Na przykład, jeśli masz kolumnę z nagłówkiem, modułem tekstowym i przyciskiem, grupowanie ich umożliwia zastosowanie ujednoliconego tła, dostosowanie odstępu lub przesuwanie całej kompozycji za pomocą jednej akcji. Oszczędza to czas i zmniejsza ryzyko niespójnych projektów, dzięki czemu grupy modułów jest niezbędnym narzędziem do łatwego tworzenia dopracowanych, profesjonalnych układów.

Dlaczego grupy modułów mają znaczenie

Grupy modułów w Divi 5 to więcej niż wygodna funkcja - wprowadzają nową warstwę kontroli i wydajności. Pozwalają projektantom i programistom tworzyć z większą precyzją i kreatywnością. Oto, dlaczego mają oni potencjał, aby wywrzeć duży wpływ na sposób projektowania stron internetowych z Divi.

1. Są częścią przyszłości Divi: grupy modułów są zbudowane z myślą o przyszłościowej architekturze Divi 5. Są przygotowane do nadchodzących funkcji, takich jak FlexBox i The Query Loop Builder, dzięki czemu tworzenie dynamicznych układów będzie proste. Inwestowanie w grupy modułów powoduje teraz długoterminowy sukces, zwłaszcza gdy ewoluuje Divi 5.
2. Oszczędzają czas: w przypadku grup modułów nie musisz radzić sobie z powtarzającymi się edytami. Możesz stylizować, zmienić położenie lub zduplikować złożone układy w jednym akcji, znacznie skracać czas projektowania. Presegs dla grup modułów posuwa się to dalej, pozwalając Ci zapisać i natychmiast zastosować predefiniowane konfiguracje.
3. Promują spójność projektowania: Grupy modułów pozwalają zapewnić każdy element grupy, od przycisków do tekstu, zgodnie z tymi samymi zasadami stylizacji. Dla osób zarządzających markowymi witrynami grupy modułów mogą utrzymać projekty dopracowane i profesjonalne na całej witrynie.
4. Bardziej twórcza swoboda: Grupy modułów pozwalają eksperymentować bez konieczności edytowania każdego elementu indywidualnie. Możesz z łatwością tworzyć wyjątkowe projekty, nawet jeśli jesteś nowy w Divi. Połączenie zagnieżdżonych rzędów i grup modułów może pomóc w odblokowaniu nieskończenie gniazdo pojemników.

Niezależnie od tego, czy jesteś projektantem solo, czy właścicielem firmy, grupy modułów zapewniają kontrolę i wydajność potrzebną do podniesienia swoich projektów.

Jak używać grup modułów w Divi 5

Rozpoczęcie działalności z grupami modułów jest łatwe. Dodaj nowy wiersz do strony w Divi 5 i wybierz układ 3 kolumny.

W Divi 5 zauważysz nowy moduł grupowy . Kliknij, aby dodać go do pierwszej kolumny.

Stamtąd możesz dodać dowolny moduł, który chcesz zbudować układ wielokrotnego użytku. Aby zademonstrować, utworzymy grupę modułów dla polecanej usługi. Zacznij od dodania 2-kolumnowego zagnieżdżonego wiersza do grupy modułów.

W pierwszej kolumnie zagnieżdżonego wiersza dodaj moduł obrazu .

W drugiej kolumnie zagnieżdżonego rzędu dodaj moduł nagłówkowy i układaj go tak, jak chcesz.

Następnie dodaj zagnieżdżony wiersz jednopolituowy , a następnie kolejny moduły nagłówka, tekstu i przycisków. Po dodaniu układ powinien wyglądać podobnie do obrazu poniżej.

Grupy modułów mogą być stylizowane jak pojedynczy moduł, dodając kolory tła lub gradienty, regulując odstępy lub dodanie efektów granicznych. Możesz także zapisać grupę modułów jako ustawienie wstępne, uzyskując dostęp do ustawień grupy modułów, klikając opcję wstępnie ustaloną i zapisując konfigurację. Tego ustawienia można następnie zastosować do innych grup modułów za pomocą jednego kliknięcia, zapewniając identyczną styl i strukturę w Twojej witrynie lub wielu projektach. Po utworzeniu grupy modułowej możesz ją zduplikować, zapisać ją na Cloud Divi lub ponownie wykorzystać ustawienie wstępne na swoich stronach internetowych.

Praktyczne przypadki użycia dla grup modułów

Grupy modułów w Divi 5 doskonale nadają się do budowania profesjonalnych, wydajnych stron internetowych. Moduły łączące w wielokrotne użycie jednostki oszczędzają czas i podnosi twoje projekty na nowe wyżyny. Niezależnie od tego, czy buduje stronę docelową, czy zarządzanie portfelem witryn klientów, grupy modułów sprawiają, że złożone układy wydają się łatwe. Oto kilka praktycznych przypadków użycia, które pokazują ich moc i usprawniają proces projektowania.

1. Przyszły przypadek użycia: posty i produkty

Grupy modułów są zbudowane tak, aby zabłysnąć z nadchodzącym konstruktorem pętli Divi 5. Przygotuj się teraz, grupując elementy do dynamicznych układów, takie jak podgląd postów na blogu lub oferty produktów WooCommerce. Po przybyciu Builder Loop, grupy te będą wypełniać treść dynamiczną bez wysiłku, oszczędzając czas i zapewniając bezbłędne, skalowalne projekty.

2. Zadzwoń do sekcji akcji

Grupa odważna nagłówek, przekonujące podtytuł i żywy przycisk z efektem zawiskowania, aby stworzyć CTA wielokrotnego użytku. Potrzebujesz tego samego CTA na wielu stronach? Zduplikuj grupę w kilka sekund lub zapisz ją do Divi Cloud, aby uzyskać natychmiastowy dostęp. To ogranicza czas konfiguracji, zapewniając jednocześnie zgodność CTA z wyglądem i wyczuciem Twojej marki.

3. Sekcje referencyjne

Połącz cytat, wizerunek i nazwę klienta w jedną grupę modułów dla spójnych, profesjonalnych układów referencyjnych. Przeciągnij grupę, aby zmienić sekcje lub zastosuj zunifikowany styl - taki jak zaokrąglone zakątki lub subtelny cień - jednym kliknięciem.

4. Kategorie produktów

Grupy modułów mogą być idealne do prezentacji kategorii produktów. Na przykład utwórz grupę, aby podkreślić liczbę produktów w kategorii, tytuł, obraz i przycisk, a następnie zduplikuj ją dla innych kategorii. Takie podejście zapewnia wizualną spójność na stronach produktów i przyspiesza projekt dla stron internetowych e-commerce.

5. Menu restauracji

Kolejnym świetnym sposobem korzystania z grup modułów jest strony internetowe, które muszą zawierać menu. Dynamiczne struktury tekstu może być czasochłonne, więc użycie grup modułów jest idealne do przyspieszenia procesu. Możesz połączyć grupy i zagnieżdżone rzędne, aby sekcja wyglądała niesamowicie i łatwym do powielania w przyszłości.

Grupy modułów w kontekście Divi 5

Divi 5 to odważny skok do przodu do projektowania WordPress, priorytetyzując szybką wydajność, elastyczność i innowacyjne funkcje, takie jak grupy modułów. Divi 5, zbudowany na nowoczesnej architekturze, pozwala tworzyć witryny, które są tak wydajne, jak one piękne. Grupy modułów są kamieniem węgielnym tej wizji, płynnie integrując się z innymi funkcjami Divi 5 w celu zwiększenia przepływu pracy. W miarę ewolucji Divi 5 w swojej publicznej fazie alfa z dwutygodniowymi aktualizacjami, grupy modułów są gotowe na nowo zdefiniować sposób budowania. Oto jak pasują do większego obrazu.

Zagnieżdżone rzędy

Połącz grupy modułów z nieskończonym gniazdowaniem Divi 5, aby stworzyć złożone, zorganizowane układy. Na przykład grupuj nagłówek, obraz i przycisk z zagnieżdżonym wierszem, aby zbudować sekcje takie jak tabele cenowe lub prezentacje członków zespołu.

Zmienne projektowe

Możesz zachować spójność projektowania, stosując wartości stylów wielokrotnego użytku w grupach modułów, takich jak kolory marki, czcionki lub obliczenia Clamp (). Możesz zaktualizować zmienną raz, a każda grupa natychmiast odzwierciedla zmianę, dzięki czemu są idealne do projektów na dużą skalę.

Zaawansowane jednostki

Możesz użyć jednostek CSS REM, EM, VW, VH lub innych, aby budować responsywne odstępy i rozmiar grup modułów. Zapewnia to, że pogrupowane elementy wyglądają oszałamiająco na każdym urządzeniu, od komputerów stacjonarnych po smartfony.

Wskazówki dotyczące maksymalizacji grup modułów

Aby jak najlepiej wykorzystać grupy modułowe, kilka inteligentnych strategii może przenieść moc projektowania na wyższy poziom. Oto jak sprawić, by ciężko dla ciebie pracowali.

1. Zaplanuj układy: Przed grupowaniem modułów naszkicuj strukturę sekcji lub użyj narzędzia prototypowania, aby pomóc Ci zaplanować elementy, których chcesz użyć. To z góry planowanie zapobiega dodatkowej pracy i zapewnia logiczne i wielokrotne użycie grup.
2. Użyj Cloud Divi: Zapisz swoje ulubione grupy modułów na Divi Cloud, aby zamienić je w zasoby krzyżowe. Na przykład możesz zapisać polerowaną grupę członków zespołu i wciągnąć ją do dowolnej witryny za pomocą kilku kliknięć.
3. Reaktywność testowa z punktami przerwania: Użyj konfigurowalnych punktów przerwania Divi 5, aby upewnić się, że grupy modułów wyglądają bezbłędnie na każdym urządzeniu. Dostosuj odstępy lub rozmiary czcionek dla telefonu komórkowego w ustawieniach grupy, aby uniknąć ręcznych poprawek.
4. Wykorzystaj zmienne projektowe: Aby dodać spójność do swoich projektów, ustawiaj zmienne projektowe dla kolorów, tekstu, czcionek lub reguł liczbowych (takich jak obliczenia clamp ()), aby ułatwić małe zmiany.
5. Bądź kreatywny w stylizacji: eksperymentuj z odważnymi efektami, takimi jak animacje najemnika lub zsynchronizowane przejścia w grupach modułów. Na przykład dodaj efekt skali do zgrupowanego przycisku i obrazu dla dynamicznego CTA.
6. Eksperyment z Divi 5: Public Alpha Divi 5 to twój plac zabaw - zbuduj stronę testową, aby eksplorować grupy modułów. Spróbuj grupować różne kombinacje modułów lub testować nowe pomysły na stylizację, aby dowiedzieć się, co jest możliwe.

Projekt mądrzejszy z grupami modułów w Divi 5

Grupy modułów Divi 5 upraszczają Twój przepływ pracy, zapewniając spójność projektowania i przygotowując Cię do przyszłości dynamicznych układów. Niezależnie od tego, czy łączenie elementów projektu dla CTA wielokrotnego użytku, tworzenie spójnych sekcji referencyjnych, czy eksperymentowanie z odważnym stylem, grupy modułów pozwalają pracować mądrzej i szybciej tworzyć strony internetowe. W miarę ewolucji Divi 5 ta funkcja umożliwia budowanie wydajnych i pięknych stron internetowych.

Zacznij eksperymentować z grupami modułów w publicznej alfa Divi 5 i doświadcz nowego sposobu budowania stron internetowych z Divi. Jak wcześniej wspomniano, Divi 5 jest gotowy na nowe strony internetowe, ale nie zalecamy ich jeszcze istniejących stron.

Zachęcamy do dołączenia do społeczności Divi do dzielenia się twoimi dziełami grupy modułów. Opublikuj swoje projekty w grupie Divi na Facebooku lub tag @eleganthemes na X.

Zbudujmy razem coś niesamowitego!