Visual Composer review

Szukasz najlepszego kreatora stron/tematów WordPress dla swojej witryny?

W naszym przeglądzie Visual Composer przyjrzymy się jednej z bardziej znanych opcji w tej przestrzeni.

Visual Composer oferuje wizualny interfejs typu „przeciągnij i upuść”, który pomoże ci zaprojektować twoją treść i/lub stronę internetową.

W wersji darmowej jest to page builder, podczas gdy wersja Pro zwiększa możliwości o wsparcie dla budowania motywów i popup builder.

W naszej praktycznej recenzji pokażemy ci, jak działa to narzędzie do projektowania.

🥳 W tym tygodniu mamy niesamowity giveaway na WP Mayor! Weź udział w konkursie i wygraj 1 z 3 licencji na Visual Composer ważnych przez rok
Weź udział w konkursietutaj.

Recenzja Visual Composer: Szybkie spojrzenie na funkcje

Na wysokim poziomie, Visual Composer pomaga ci zaprojektować twoją stronę WordPress bez konieczności posiadania wiedzy technicznej (nie potrzebujesz kodu/CSS).

Aby Ci w tym pomóc, Visual Composer oferuje w pełni wizualny, przeciągany i upuszczany interfejs projektowania. Więc podczas projektowania treści, będziesz widział swój projekt dokładnie tak, jak zobaczą go odwiedzający, co sprawia, że naprawdę łatwo jest dostosować rzeczy.

Możesz tworzyć swoje projekty używając 300+ elementów treści i otrzymasz także 200+ gotowych szablonów, które pomogą ci zaoszczędzić czas.

Dla bardziej zaawansowanych przypadków użycia, otrzymasz także:

  • Theme builder – zaprojektuj swój nagłówek, stopkę i inne kluczowe szablony/stronę motywu.
  • Popup builder – stwórz własne popupy, które wyświetlisz w dowolnym miejscu na swojej stronie.

To tylko krótkie podsumowanie – przeczytaj naszą pełną recenzję Visual Composer, aby dowiedzieć się więcej o jego funkcjach.

Visual Composer – ta wtyczka dołączana do motywów ThemeForest?

Jeśli jesteś w przestrzeni WordPressa od jakiegoś czasu, możesz znać nazwę „Visual Composer”, ponieważ był to plugin do budowania stron, który był dołączony do wielu motywów na ThemeForest.

Jednakże, tamto wcielenie Visual Composer zostało przemianowane na WPBakery Page Builder. Ta wersja Visual Composer jest całkowicie nowa pod względem funkcji i architektury backendu. Oprócz używania nowego edytora opartego na React i oferowania bardziej płynnej edycji inline, nowy Visual Composer nie używa również shortcodes.

Praktyczna praca z Visual Composerem

Przejdźmy teraz do praktycznej pracy z Visual Composerem i pokażę ci kilka kluczowych funkcji. W tej sekcji używam wersji premium, ale Visual Composer ma także wersję darmową, która używa tego samego interfejsu – więcej o cenach później.

Przedstawienie interfejsu

Na początek przyjrzyjmy się interfejsowi.

Po lewej stronie zobaczysz rozwijalny pasek boczny, gdzie będziesz miał dostęp do kluczowych akcji, takich jak dodawanie nowych modułów treści czy wstawianie szablonów – więcej na ten temat w dalszej części tekstu:

The Visual Composer interface

Aby edytować dowolny tekst, możesz po prostu kliknąć i wpisać go na stronie (tzw. „edycja inline”). Visual Composer umieści punktowe podświetlenie na tekście, który edytujesz, co ułatwi ci skupienie się na nim. Otrzymasz także pasek narzędzi formatowania, aby mieć dostęp do kluczowych opcji, takich jak pogrubienie, wyrównanie, listy itp.

Editing text

Aby stworzyć układ swojego projektu, możesz ustawić własną siatkę z dowolną liczbą kolumn. Możesz wtedy używać metody „przeciągnij i upuść” do przesuwania elementów zawartości. Masz też do dyspozycji kilka wygodnych funkcji, takich jak możliwość szybkiej zmiany rozmiaru kolumn metodą „przeciągnij i upuść”:

Resizing columns

Dodawanie i dostosowywanie modułów treści

Aby dodać zawartość do swojego projektu, możesz kliknąć ikonę „plus” na pasku bocznym, aby rozwinąć listę elementów zawartości. Są one podzielone na różne sekcje, takie jak:

  • Podstawowe – podstawowe bloki treści jak tekst, przyciski itp.
  • Media – obrazki, galerie obrazków, embedy YouTube/Vimeo itp.
  • Buttons
  • Kontenery – wstawiaj wiersze (i kolumny).
  • Społecznościowe – Facebook, Twitter, ikonyspołecznościowe , Pinterest, itd.
  • Integracje – Google Maps + więcej.
  • Menu
  • Inne

Niektóre kategorie nakładają się na siebie. Na przykład przyciski pojawiają się zarówno w kategorii podstawowe, jak i przyciski.

Jeśli najedziesz na jakikolwiek element, zobaczysz jego podgląd. A żeby dodać element do swojej strony, po prostu przeciągnij go w miejsce, w którym chcesz go użyć:

Adding an element

Jedną z unikalnych opcji w Visual Composer jest to, że możesz połączyć się z Visual Composer Hub, aby pobrać więcej elementów na swoją stronę. Z wersją premium, otrzymujesz dostęp do ponad 300+ różnych elementów, co jest więcej niż większość innych kreatorów stron oferuje w swoich podstawowych wtyczkach:

Content elements

Kiedy już pobierzesz element na swoją stronę, będziesz mógł go wstawić tak jak każdy inny element.

Inną fajną opcją jest to, że możesz zapisać dostosowane elementy jako nowy element. Na przykład, możesz dodać podstawowy przycisk i skonfigurować go z wszystkimi swoimi ulubionymi ustawieniami. Następnie możesz zapisać ten już skonfigurowany przycisk jako nowy element, tak abyś mógł go szybko użyć ponownie w przyszłości.

Aby skonfigurować element, możesz otworzyć jego ustawienia i zobaczyć je na pasku bocznym. Dostaniesz tam sporo opcji, w tym możliwość ustawienia niestandardowych odstępów, a także wprowadzenia różnych ustawień dla różnych typów urządzeń (responsywny design).

Jedną z przydatnych i unikalnych funkcji jest możliwość zastosowania leniwego ładowania do każdego elementu, czego nigdy nie widziałem w innych page builderach. Jest to fajna opcja dla optymalizacji wydajności:

Content element settings

Ogółem, ogromna liczba elementów treści jest zdecydowanie jedną z najmocniejszych stron Visual Composera, ponieważ daje ci dużo elastyczności przy tworzeniu twoich projektów.

Poznaj kilka fajnych funkcji interfejsu

W tym momencie powinieneś mieć już całkiem dobre pojęcie o tym, jak działa Visual Composer na poziomie podstawowym. Teraz przyjrzyjmy się kilku fajnym szczegółom interfejsu, które pomogą ci tworzyć projekty bardziej efektywnie.

Po pierwsze, masz do dyspozycji kilka różnych responsywnych podglądów, dzięki którym możesz zobaczyć jak Twój projekt będzie wyglądał na różnych urządzeniach.

Responsive preview

Po drugie, masz wsparcie dla prawego przycisku myszy, co jest przydatne, by pracować bardziej efektywnie. Kiedy klikniesz prawym przyciskiem myszy na elemencie, otrzymasz opcje, aby:

  • Edytuj
  • Sklonuj
  • Kopiuj (a potem wklej)
  • Usuń

Ostatnią cechą, na którą chciałbym zwrócić uwagę, jest widok drzewa, który daje ci wysokopoziomowy wgląd w strukturę twojego projektu (coś w rodzaju widoku DOM)

Jedną z fajnych rzeczy jest to, że możesz zmieniać nazwy elementów w widoku drzewa, co pomoże Ci zachować porządek. Na przykład, możesz nazwać wiersz „Sekcja Bohatera”:

Visual Composer tree view

Inne przydatne funkcje to:

  • Przyciski Undo/redo.
  • Wbudowana integracja z Unsplash, aby znaleźć zdjęcia ze stocków.
  • Wbudowana integracja z Giphy dla GIFów.
  • Możliwość dodania własnego CSS lub JavaScript.

Używanie szablonów

Oprócz tego, że Visual Composer daje ci dostęp do 300+ elementów treści, posiada także 200+ gotowych szablonów

Istnieją dwa rodzaje szablonów, które możesz wstawić:

  • Szablony – są to pełne projekty stron. Wystarczy, że je zaimportujesz, dostosujesz wygląd i masz gotową stronę.
  • Bloki – są to szablony dla konkretnych sekcji strony. Możesz je składać jak klocki Lego, by stworzyć swój projekt.

Podobnie jak w przypadku dodawania nowych elementów treści, wszystkie szablony i bloki możesz znaleźć w Visual Composer Hub. Kiedy pobierzesz je na swoją stronę, możesz je wstawić za pomocą kilku kliknięć:

Templates

Jeśli chodzi o jakość szablonów, to oczywiście jest to kwestia subiektywna. Ale te, które sprawdziłam, wyglądają świetnie. Oto przykład szablonu strony docelowej:

Visual Composer landing page template

Możesz także zapisywać swoje własne projekty jako szablony, aby szybko wykorzystać je później.

Korzystanie z pełnego budowania motywów

Z wersją premium, Visual Composer oferuje pełne wsparcie dla budowania motywów. Oznacza to, że możesz wyjść poza projektowanie pojedynczych postów/stron i tworzyć rzeczywiste szablony dla swojego motywu. Możesz tworzyć szablony dla:

  • Nagłówki
  • Stopki
  • Archiwa (np. strona z listą wszystkich postów z Twojego bloga)
  • Stopki
  • Paski boczne

Jednym ograniczeniem jest to, że nie możesz tworzyć pojedynczych szablonów – tj. szablonu, którego używają wszystkie twoje posty na blogu. Możesz utworzyć szablon, który ręcznie przypiszesz do swoich wpisów na blogu. Ale nie możesz stworzyć pojedynczego szablonu, który będzie automatycznie używany przez wszystkie istniejące posty na Twoim blogu. Myślę, że jest to ważna część kreatora motywów(szczególnie dla budowania stron z własną treścią), więc dobrze by było, gdyby ta funkcja została dodana.

Podstawowy interfejs jest taki sam, kiedy tworzysz szablony motywów. I tak jak przy tworzeniu pojedynczych projektów, możesz także używać szablonów, aby zaoszczędzić czas.

Aby pomóc ci w tworzeniu projektów, otrzymasz kilka dedykowanych elementów. Na przykład, jeśli tworzysz nagłówek, możesz dołączyć element Podstawowe menu, aby osadzić natywne menu WordPressa, które tworzysz w Wygląd → Menu:

Header builder in Visual Composer

Stamtąd możesz opublikować swój szablon, aby go uruchomić. Jednak jesteś też trochę ograniczony, jeśli chodzi o kontrolowanie tego, gdzie pojawia się twój szablon. Nie ma opcji, aby, powiedzmy, automatycznie używać nagłówka dla wszystkich postów w określonej kategorii.

Masz jednak pewne zaawansowane opcje, aby wybrać niestandardowy nagłówek dla różnych typów treści, a także możliwość zmiany go na zasadzie „kawałek po kawałku”.

Header display

Możesz także powiązać nagłówki i stopki z szablonem, który zapisujesz w Visual Composer, co ułatwia zastosowanie ich do nowych postów:

Assign header to template

Ogólnie rzecz biorąc, powiedziałbym, że kreator motywów jest świetny dla ludzi, którzy chcą mieć większą kontrolę nad swoimi motywami, jak na przykład zaprojektować własny nagłówek lub stopkę

Ale dla bardziej zaawansowanych przypadków użycia (jak budowanie stron z własną treścią), myślę, że pozostaje on w tyle za innymi narzędziami, ponieważ nie możesz projektować pojedynczych szablonów i nie ma warunkowych reguł wyświetlania dla szablonów.

Wstawianie dynamicznej zawartości

Kolejną użyteczną funkcją w Visual Composer’s theme builder jest możliwość wstawiania dynamicznej zawartości z twojej strony lub niestandardowych pól, które dodałeś za pomocą wtyczek takich jak Toolset lub Advanced Custom Fields. To otwiera wiele możliwości używania Visual Composera do tworzenia niestandardowych, dynamicznych stron

Kiedy masz już kilka pól niestandardowych, możesz użyć dynamicznej ikony obok dowolnego wspieranego pola, aby wypełnić to pole danymi z pola niestandardowego. Jeśli używasz wspieranej wtyczki, powinieneś zobaczyć pole niestandardowe na liście rozwijanej:

Visual Composer dynamic content

Możesz użyć pól niestandardowych do wypełnienia:

  • Tekst
  • Obrazy
  • Adresy URL
  • Numery

Na przykład, możesz stworzyć własne pole do załadowania obrazka, a następnie użyć tego pliku jako tła sekcji.

To jest zaawansowana funkcja, ale jest naprawdę przydatna przy budowaniu niestandardowych witryn WordPress.

Używanie Popup Buildera

Ostatnią funkcją, na którą chcę zwrócić uwagę, jest popup builder Visual Composera. Ta funkcja pozwala ci używać tego samego wizualnego, przeciągnij i upuść interfejsu z góry, aby zaprojektować popupy, które możesz wyświetlać w dowolnym miejscu na swojej stronie.

Możesz użyć dowolnych elementów w popupie, co otwiera dużą elastyczność. Na przykład, możesz zawrzeć formularz w popupie, aby stworzyć popup optin email lub popup z formularzem kontaktowym. Możesz też umieścić w nim przyciski do powiadomień lub CTA.

Dostaniesz też ustawienia do kontrolowania kontenera popupu, co pozwoli ci stworzyć mnóstwo różnych typów popupów, od modalnych popupów po paski powiadomień, wysuwane okienka i wiele innych

Popup canvas settings

Aby wyzwalać swoje popupy, masz do dyspozycji kilka opcji.

Po pierwsze, możesz ustawić reguły dla całego serwisu, aby wyświetlić popup na każdej stronie z różnymi wyzwalaczami:

Popup settings

Możesz także:

  • Ręcznie połącz popup z konkretnym postem/stroną, aby wyświetlić popup na tej części zawartości.
  • Otwórz popup przez kliknięcie na link/przycisk.

Nie masz jednak opcji, aby uzyskać bardziej szczegółową kontrolę w całym serwisie. Na przykład, nie możesz automatycznie kierować popupu do wszystkich postów w określonej kategorii(chociaż możesz ręcznie połączyć go z wszystkimi tymi postami).

Ceny Visual Composer

Visual Composer ma zarówno darmową wersję na WordPress.org, jak i wersję premium.

Istnieje wiele różnic w funkcjach między wersją darmową a płatną, ale najważniejsze są następujące:

  • Darmowa wersja – to tylko kreator stron. Możesz tworzyć projekty dla pojedynczych postów i stron.
  • Wersja Pro – zawiera motyw i kreator popupów. Możesz go użyć do zaprojektowania szablonu nagłówka dla swojego motywu, popupów, itp. Otrzymujesz również dostęp do większej ilości elementów i szablonów.

Oto tabela porównawcza z bardziej szczegółowym spojrzeniem na różnice w funkcjach między Visual Composer free vs pro:

Visual Composer free vs Pro

Wersja premium ma trzy opcje licencji – jedyną różnicą jest liczba stron, na których możesz używać wtyczki:

  • Jedna strona – 49$
  • Trzy strony – 99$
  • Nieograniczona ilość stron – $349

Wszystkie plany są objęte 15-dniową gwarancją zwrotu pieniędzy.

Jeśli chcesz zaoszczędzić trochę pieniędzy, mamy specjalny kod rabatowy 10% zniżki, który jest ważny do 2 lipca 2022 roku. To sprowadza cenę początkową do zaledwie 44,10$.

10% OFF

Visual Composer
Visual Composer

Zyskaj 10% zniżki na Visual Composer – Stwórz swoją stronę WordPress już dziś. Zacznij łatwo. Buduj szybko.Pokaż więcej
Zyskaj 10% zniżki na Visual Composer – Stwórz swoją stronę WordPress już dziś. Zacznij łatwo. Buduj szybko.Pokaż mniej

Końcowe przemyślenia na temat Visual Composer

Ogólnie rzecz biorąc, powiedziałbym, że interfejs Visual Composer jest dobrze zrobiony i na równi z innymi narzędziami. Podczas moich testów działał szybko i masz teraz do dyspozycji takie funkcje jak edycja tekstu w linii oraz zmiana rozmiaru kolumn metodą „przeciągnij i upuść”, które są naprawdę wygodne podczas tworzenia projektów.

Oprócz ogólnie ładnego interfejsu, powiedziałbym, że jedną z wyróżniających się cech Visual Composera jest jego ogromna biblioteka elementów treści. Przy 300+ elementach w wersji premium, masz dużo elastyczności przy tworzeniu projektów, włączając w to wiele unikalnych elementów, których inne kreatory stron nie oferują.

Zasadniczo, jeśli chcesz mieć narzędzie, które pomoże ci stworzyć bardziej wystylizowane posty i strony, Visual Composer zdecydowanie może wykonać tę pracę.

Jeśli chodzi o kreator motywów i popup builder, powiedziałbym, że Visual Composer jest w porządku dla prostych przypadków użycia, ale nie dorównuje innym popularnym narzędziom pod względem elastyczności i reguł warunkowych dla całego serwisu. Brak możliwości tworzenia pojedynczych szablonów jest kluczowym ograniczeniem, jeśli chodzi o bardziej zaawansowane budowanie motywów, choć nie będzie to miało wpływu na zwykłych użytkowników, którzy już lubią szablony swoich motywów.

Otrzymujesz jednak dynamiczne wsparcie dla pól własnych, co jest świetne. I podoba mi się to, że Visual Composer automatycznie pobiera niestandardowe pola z obsługiwanych wtyczek (jak ACF).

Jeśli chcesz wypróbować go sam, możesz zapoznać się z interfejsem używając darmowej wersji na WordPress.org. Jeśli spodoba Ci się to, jak działa, rozważ aktualizację do wersji premium, aby odblokować wszystkie funkcje.

Artykuł w wersji oryginalnej

Podobne