Najważniejsze cechy wtyczki Divi: Woo Essential

Woo Essential to wtyczka innej firmy, która dodaje 8 nowych modułów Woo Commerce do Divi Builder. Dodaje również kilka funkcji usprawniających proces zakupów, umożliwiając wyświetlanie produktów i kategorii w wielu układach i wielu opcjach funkcji. W tym poście przyjrzymy się modułom i funkcjom Woo Essential, aby pomóc Ci zdecydować, czy jest to odpowiedni produkt dla Twoich potrzeb.

Podstawowe moduły Woo Divi

Woo Essential dodaje 8 modułów do Divi Builder. Niektóre funkcje wymagają wtyczek YITH WooCommerce Compare i YITH WooCommerce Listy życzeń. Darmowe wersje są do tego odpowiednie. Zobaczysz powiadomienie, jeśli nie masz ich zainstalowanych. Po prostu kliknij powiadomienie, aby je zainstalować i aktywować po aktywacji wtyczki Woo Essential.

Na początku nie zobaczysz wszystkich modułów w Divi Builder. Zamiast tego zobaczysz jeden moduł o nazwie Woo Essential. Kliknij ten moduł.

Wszystkie moduły Woo Essential zostaną wyświetlone w oknie modalnym. Możesz teraz dodawać moduły do ​​dowolnego układu Divi, aby wyświetlać produkty WooCommerce.

Przyjrzyjmy się bliżej każdemu z podstawowych modułów Woo. Pokażę ustawienia domyślne, a następnie pokażę przykład niektórych funkcji projektu.

Akordeon kategorii Woo

Moduł Woo Category Accordion wyświetla obrazy dla kategorii produktów. Obrazy rozwijają się po najechaniu kursorem, aby wyświetlić opis kategorii i liczbę elementów w tej kategorii. Pokaże obraz kategorii, jeśli masz taki skonfigurowany.

Masz pełną kontrolę nad projektem każdego elementu. W tym przykładzie dodałem cień ramki, zaokrągliłem rogi i zmieniłem kolory i rozmiary czcionek dla nazwy kategorii, liczby i opisu. Dodałem również dopełnienie i wysokość linii do opisu.

Karuzela kategorii Woo

Karuzela kategorii Woo tworzy suwak wraz z nawigacją i automatycznym przesuwaniem. Ma wiele ustawień, aby dostosować karuzelę.

Siatka kategorii Woo

Siatka kategorii Woo wyświetla kategorie jako karty w siatce. Siatka jest regulowana, więc możesz zmienić liczbę kolumn.

W tym przypadku dodałem obramowanie, zaokrągliłem rogi, dostosowałem czcionki i zmieniłem ustawienia liczby siatek i odstępów.

Woo Kategoria Masoneria

Moduł Woo Category Masonry umieszcza kategorie w siatce muru.

W tym przykładzie dostosowałem numer siatki i odstęp oraz zmieniłem czcionki.

Akordeon firmy Woo

Akordeon produktów Woo działa jak akordeon kategorii Woo, z wyjątkiem tego, że pokazuje same produkty. Po najechaniu kursorem rozwija się, aby wyświetlić informacje o produkcie. Wybierz elementy do wyświetlenia z przycisku Dodaj do koszyka, ceny, liczby gwiazdek, opisu, plakietki polecanego produktu, rodzaju plakietki wyprzedaży i tekstu plakietki wyprzedaży. Możesz także kontrolować sposób działania akordeonu. Wszystkie moduły produktu domyślnie pokazują wyróżniony obraz.

W tym przykładzie dostosowałem tło treści, zmieniłem kolory czcionek, zmieniłem kolor plakietki, zwiększyłem rozmiar czcionki nazwy produktu i zmieniłem kolor przycisku Dodaj do koszyka.

Karuzela produktów Woo

Karuzela produktów Woo wyświetla produkty w jednej z sześciu opcji układu. Każdy zawiera inny efekt aktywowania przycisków. Możesz także wybrać, które elementy mają być wyświetlane, dostosować ustawienia karuzeli itp.

Każdy element możesz dostosować niezależnie. W tym przykładzie dostosowałem wiele kolorów, obramowań i czcionek. Dodałem również nawigację strzałkową. To jest Layout 3, który umieszcza koszyk i inne linki na dole obrazu po najechaniu myszką.

Filtr produktów Woo

Filtr produktów Woo dodaje siatkę produktów WooCommerce z dostosowywanym filtrem. Możesz wybrać, które elementy mają być wyświetlane.

Masz pełną kontrolę nad każdym elementem, w tym filtrem, siatką, czcionkami, kolorami itp. W tym przykładzie zmieniłem kilka kolorów, rozmiary czcionek i dostosowałem liczbę siatek. Dodałem również cień pudełka zarówno do filtra, jak i do siatki produktów.

Siatka produktów Woo

Moduł siatki produktów Woo wyświetla produkty w siatce z banerem, który pokazuje liczbę produktów. Ma 8 opcji układu siatki, która zmienia rozmiar obrazu i umieszcza przyciski w różnych miejscach po najechaniu myszką. Możesz wybrać wyświetlane elementy. To pokazuje układ 8, który umieszcza ikony po prawej stronie obrazu i przycisk Dodaj do koszyka na dole obrazu po najechaniu myszką.

Możesz dodać paginację z przyciskami do każdej strony lub przycisk Załaduj więcej. W tym przykładzie dodałem przycisk Załaduj więcej i nadałem mu styl. To jest układ 3, który umieszcza tytuł i cenę pod obrazem i dodaje ikony blisko dołu obrazu po najechaniu kursorem.

Więcej niezbędnych funkcji Woo

Istnieje wiele funkcji, w większości zawartych w modułach, które dodają funkcjonalność do list WooCommerce. Oto krótkie spojrzenie na kilka z tych funkcji.

Mini wózek Woo Essential Woo

Funkcja Mini Cart dodaje wyskakujące menu do koszyka. Jest automatycznie dodawany do domyślnego nagłówka WordPress. Działa tylko z domyślnym nagłówkiem, więc nie będziesz mógł dodać go do nagłówków utworzonych za pomocą Divi Builder. Oznacza to, że nie jest tak wszechstronny, jak inne funkcje tej wtyczki. Możesz dostosować wszystkie trzy jego elementy niezależnie za pomocą narzędzia Theme Customizer.

Zawiera cztery sekcje ustawień dla głównych ustawień koszyka, projektu koszyka, przycisku przeglądania koszyka i przycisku kasy.

Kontroluj sposób działania i zmieniaj rozmiar, kształt, kolory, czcionki, ikony itp. Otwieraj je po najechaniu myszką, kliknięciu lub przesunięciu z prawej lub lewej strony.

Mini Koszyk otwiera mały modal pokazujący zawartość Twojego koszyka. Może również otwierać okno po prawej lub lewej stronie, w zależności od ustawień. Ten przykład pokazuje otwieranie modalne po najechaniu kursorem. Opcja Fly-In, która przesuwa się z prawej lub lewej strony, daje modalowi pełną wysokość ekranu.

Wyskakujące okno szybkiego podglądu Woo Essential

Możesz przeglądać szczegóły pozycji bez opuszczania bieżącej strony. Ikona szybkiego podglądu została dodana do kilku modułów. Kliknięcie tej ikony otwiera szczegóły w oknie modalnym. Wyskakujące okienko jest szybkie i ułatwia przeglądanie szczegółów produktu bez ładowania kolejnej strony.

Szczegóły obejmują wszystkie informacje o produkcie, takie jak opis, galeria, przycisk Dodaj do koszyka, kategorię itp.

Woo Essential Porównaj produkty

Możesz porównać wiele produktów, wybierając ikonę porównania. Na początku ten proces może być nieco skomplikowany, więc wielu użytkowników może nie być świadomych, że mogą porównywać produkty.

Aby dokonać porównania, przejrzyj produkty, które chcesz porównać. Następnie kliknij ikonę porównania na jednym z produktów. Modal porównania z otwartymi produktami porównywanymi w tabeli. To działa, ale nie jest tak intuicyjne, jak lubię. Ustalenie tego wymagało trochę pracy. Informacje, których potrzebowałem, znajdowały się w dokumentacji. Możesz przewinąć porównanie i zamknąć okno modalne, gdy będziesz gotowy.

Podstawowe ustawienia Woo

Woo Essential dodaje link do pulpitu nawigacyjnego WordPress. Wybierz ten link, aby otworzyć ustawienia. Pierwsza strona, Strona główna, zawiera łącza do bazy wiedzy, pomocy technicznej i opinii, propozycji funkcji oraz kanału YouTube DiviNext.

Wybierz Moduły, aby wyświetlić drugą stronę. Tutaj możesz wyłączyć lub włączyć dowolny moduł Woo Essential. Jest to dobre, jeśli chcesz ograniczyć projekt do zaledwie kilku modułów. Wszystkie są domyślnie włączone.

Niezbędne szablony Woo

Witryna wydawcy zawiera 8 bezpłatnych układów startowych, które pomogą Ci rozpocząć pracę nad projektami. Do działania wymagają również innej wtyczki Divi, więc ich użyteczność jest ograniczona do tych z obiema wtyczkami. Wyglądają świetnie i zapewniają wiele sekcji do wykorzystania.

Kup Woo Essential

Wii Essential jest dostępne w Divi Marketplace za 79 USD. Obejmuje nieograniczone użytkowanie, 30-dniową gwarancję zwrotu pieniędzy oraz rok wsparcia i aktualizacji.

Kończące myśli

Oto nasze spojrzenie na Woo Essentials dla Divi. Te 8 modułów Divi zapewnia wiele opcji dla siatek produktów i akordeonów. Z łatwością wyświetlaj poszczególne produkty i kategorie i stylizuj je za pomocą Divi Builder. Łatwo przeglądaj zawartość koszyka, szczegóły produktu i porównuj produkty. Chciałbym zobaczyć Mini Cart jako moduł Divi, aby można go było dodawać do nagłówków utworzonych za pomocą Divi Builder. Działa jednak dobrze, jeśli używasz domyślnego nagłówka WordPress. Jeśli jesteś zainteresowany rozszerzeniem stron produktów WooCommerce o wiele interesujących siatek, warto zajrzeć do Woo Essentials.

Chcemy usłyszeć od ciebie. Czy próbowałeś Divi Essentials? Daj nam znać, co o tym myślisz w komentarzach.