Najlepszy edytor WordPress WYSIWYG — porównanie 7 kreatorów stron

Opublikowany: 2018-12-10

Szukasz najlepszego edytora WYSIWYG dla WordPressa?

Ten artykuł jest oparty na moim doświadczeniu z ostatnich trzech lat, kiedy przechodziłem od jednego edytora WP typu „przeciągnij i upuść” do drugiego.

W końcu znalazłem taki, który lubię kochać i powiem, który jest poniżej.

Best WordPress WYSIWYG Editor

spis treści
Jaki jest najlepszy edytor WYSIWYG WordPress?
#1 — Kompozytor wizualny
#2 — Kreator stron pochodzenia witryny
#3 — Konstruktor Divi
#4 - Kreator Stron Elementora
#5 — Rozkwit architekta
#6 - Budowniczy bobrów
#7 - Edytor WordPress Gutenberg
Podsumowanie — najlepszy edytor WordPress WYSIWYG
Powiązane artykuły

Dlaczego więc potrzebujesz edytora WYSIWYG dla WordPressa?

W końcu WordPress jest już dostarczany w pakiecie z edytorem o nazwie TinyMCE, który technicznie jest edytorem WYSIWYG.

Powinienem tutaj wyjaśnić, że przez edytor WYSIWYG rozumiem edytor, w którym widzisz dokładnie to, co otrzymujesz, tworząc swoją stronę lub post.

Z TinyMCE nie wiesz dokładnie, jak będzie wyglądać wyjście, dopóki nie naciśniesz „zapisz”, a następnie wyświetlisz podgląd.

Recenzowane tutaj edytory WYSIWYG umożliwiają edycję front-end na żywo (z wyjątkiem Kreatora stron Site Origin – więcej na ten temat poniżej). Oznacza to, że podczas edytowania strony lub posta widzisz wynik końcowy dokładnie taki, jaki pojawia się na stronie.

I właśnie dlatego odpowiedni edytor WYSIWYG, czyli edytor typu „przeciągnij i upuść” lub edytor wizualny, jest koniecznością dla zapracowanych blogerów, którzy muszą szybko przesyłać swoje artykuły lub posty na blogu.

Niedawno zmieniłem edytor wizualny, którego używam, z programu Page Builder Premium firmy Site Origin na Thrive Architect. Przed przeprowadzką przeprowadziłem sporo badań: to byli kandydaci, których brałem pod uwagę.

Ujawnienie: Niektóre z linków w tym poście to „linki partnerskie”. Oznacza to, że jeśli klikniesz na link i kupisz przedmiot, otrzymam prowizję partnerską.

Jaki jest najlepszy edytor WYSIWYG WordPress?

#1 — Kompozytor wizualny

Visual Composer to jeden z najlepiej sprzedających się kreatorów stron typu „przeciągnij i upuść” dla WordPress. To zdecydowanie pretendent do najlepszego edytora WordPress WYSIWYG.

Ma w pełni funkcjonalny edytor back-end i front-end i współpracuje z dowolnym motywem WordPress.

Visual Composer zawiera ponad 45 modułów treści, w tym:

  • siatki postów
  • wsparcie dla mediów
  • wykresy
  • tło pokazu slajdów
  • pokaz slajdów karuzeli
  • Youtube
  • Vimeo
  • wideo z własnego hosta

Niektóre inne funkcje programu Visual Composer to:

  • Łatwy do zastosowania efekt tła paralaksy dla sekcji, wierszy i kolumn
  • Tło gradientowe CSS z obsługą kanału alfa
  • Obsługuje posty, strony i posty niestandardowe
  • Obsługuje skróty WordPress
  • System szablonów pozwala na zapisanie niestandardowych elementów projektu jako szablonów
  • Zoptymalizowany pod kątem SEO, dzięki czemu treść ma dobry początek pod względem rankingu słów kluczowych
  • W pełni responsywny na urządzeniach mobilnych
  • Pełna historia zmian pozwala szybko wrócić do poprzednich wersji Twojej pracy
  • Obsługuje domyślne widżety WordPress
  • Edytor paska bocznego
  • Edytor nagłówków
  • Edytor stopek
  • Przenieś swoje szablony Visual Composer z witryny do witryny w kilka sekund
  • Kompatybilny z Gutenbergiem - dodawaj bloki Gutenberga w dowolnym miejscu w układzie strony

W skrócie

Działa dobrze w przypadku podstawowych układów. Układ i interfejs użytkownika nie są zbyt intuicyjne. Niezbyt duży wybór elementów treści w porównaniu z innymi kreatorami stron.

cennik

  • Bezpłatny
  • Zaczyna się od 49 USD rocznie
Uzyskaj kompozytora wizualnego

#2 — Kreator stron pochodzenia witryny

Z ponad milionem aktywnych instalacji, Kreator Stron Site Origin jest jednym z najpopularniejszych kreatorów stron WordPress. Jego popularność wynika częściowo z faktu, że jest bezpłatny (choć można kupić pakiet widżetów premium).

Oto niektóre z funkcji:

  • działa z dowolnym motywem WordPress
  • wybierz dokładną liczbę wierszy dla każdej dodanej kolumny
  • Użyj wszystkich istniejących widżetów WordPress
  • Elastyczny projekt
  • Obsługiwane są posty, strony i niestandardowe typy postów
  • Narzędzie historii zmian pozwala cofnąć zmiany

Chociaż Kreator Stron Site Origin jest bezpłatny, istnieje pakiet widżetów Premium (29 USD), który zawiera dodatki, takie jak:

  • Akordeon
  • Blokuj animacje
  • Formularz kontaktowy
  • Widżety wezwania do działania
  • Lightbox
  • Suwaki paralaksy
  • Referencje

Site Origin Page Builder integruje się z dowolnym motywem WP, więc nie zobowiązuje Cię do konkretnego motywu.

Nie ma tylu opcji stylizacji, co inne edytory wizualne WordPress. Aby uzyskać zaawansowane stylizacje, musisz znać CSS.

Site Origin ma zarówno edytory back-end, jak i front-end. Ale edytor frontendu nie jest tak zaawansowany, jak inne recenzowane tutaj edytory wysiwyg.

best wordpress wysiwyg editor

Kreator stron pochodzenia witryny - backend

Zmiany, które wprowadzasz w edytorze front-endu, nie są od razu widoczne – musisz poczekać kilka sekund na ponowne wczytanie strony.

Sprawia to, że jest nieporęczny w porównaniu z innymi edytorami i spowalnia proces tworzenia nowego posta na blogu.

best wordpress wysiwyg editor

Kreator stron Site Origin — Edytor na żywo

Innym problemem, który znalazłem w Site Origin Page Builder, jest to, że trudno jest znaleźć właściwe miejsce do wstawienia elementu, takiego jak nowy akapit, nowy nagłówek lub nowy obraz.

W edytorze na żywo możesz dodać element (lub moduł) tylko w panelu po lewej stronie. Ale bardzo trudno jest określić, gdzie jesteś w panelu po lewej stronie.

Byłoby wspaniale, gdyby dodali taką funkcję: po najechaniu myszą na element w panelu po prawej stronie, automatycznie przewija on panel po lewej stronie i podświetla odpowiedni blok w panelu po lewej stronie. W ten sposób będziesz wiedział, gdzie wstawić nowy element lub moduł.

Napisałem o tym do Site Origin Page Builder nieco ponad rok temu. Ale najwyraźniej nie wzięli tego na pokład.

Ostatnia uwaga:

Jeśli odinstalujesz Site Origin Page Builder, pozostanie mieszanina czystego kodu HTML i krótkich kodów. Oznacza to, że strony utworzone przez Ciebie w Site Origin mogą nie być edytowalne w innym narzędziu do tworzenia stron.

W skrócie

Kreator stron Site Origin nie należy do tej samej ligi co Elementor i Thrive Architect. Moim zdaniem nie jest to kandydat na „najlepszy edytor WYSIWYG WordPress”.

Po pierwsze, „Live Editor” nie jest prawdziwym edytorem front-end. Zmiany nie są widoczne od razu podczas edycji — po każdej edycji strona jest ładowana z opóźnieniem. To naprawdę Cię spowalnia.

cennik

  • Kreator stron Site Origin można pobrać bezpłatnie
  • Site Origin Premium zaczyna się od 29 USD rocznie
Pobierz Kreator pochodzenia witryny

#3 — Konstruktor Divi

Divi Builder był pierwotnie częścią motywu Divi autorstwa Elegant Themes. Ale teraz jest to samodzielny kreator stron, który działa z dowolnym motywem WordPress.

Niektóre z funkcji to:

  • edycja front-end i back-end
  • W pełni responsywny projekt
  • Wsparcie dla postów, stron i niestandardowych postów
  • Przyjdź z 46 modułami do tworzenia stron
  • Szybki i łatwy w użyciu
  • Umożliwia testowanie A/B różnych układów
  • wsparcie niestandardowego CSS

W skrócie

Z ponad 500 000 klientami Divi Builder jest jednym z najpopularniejszych dostępnych edytorów WordPress. Zawiera ponad 20 różnych układów i szablonów dla różnych rodzajów witryn

Jednak Divi Builder w dużej mierze opiera się na krótkich kodach. Oznacza to, że nie możesz przełączyć się na inny kreator stron. W efekcie jesteś ograniczony do korzystania z Divi Builder. Jest to poważna wada i moim zdaniem wyklucza ją z wyścigu o najlepszy edytor WordPress WYSIWYG.

cennik

  • Aby pobrać Divi Builder, musisz zostać członkiem Elegant Themes, który kosztuje 89 USD rocznie.
  • Daje to również dostęp do każdego motywu i wtyczki stworzonej przez motywy Elegant – nie jest to zła okazja!
Pobierz Divi Builder

#4 - Kreator Stron Elementora

Elementor Page Builder to stosunkowo nowy edytor wizualny WordPress (uruchomiony w 2016 r.), ale ma już ponad 1 000 000 aktywnych instalacji.

Określa się jako „Wiodący na świecie kreator stron WordPress”.

O ile mi wiadomo, jest to jedyny program do tworzenia stron WordPress o otwartym kodzie źródłowym. Tysiące programistów rozszerzyło podstawową funkcjonalność Elementora, tworząc motywy, dodatki i inne produkty.

Oto niektóre z funkcji:

  • System szablonów pozwala zapisywać układy i ponownie wykorzystywać je w innym miejscu w witrynie
  • Umożliwia dodawanie widżetów stworzonych przez inne wtyczki WordPress
  • Zawiera ponad 300 szablonów, zaprojektowanych tak, aby pasowały do ​​każdej branży i potrzeb
  • Prawdziwa edycja frontendu — oglądaj swoją stronę na żywo podczas jej edycji
  • Pozostawia czysty kod (jeśli dezaktywujesz Elementora)
  • Zaprojektuj całą stronę docelową z Elementor's Canvas
  • Ponad 80 elementów projektu, w tym podstawowe widżety graficzne i tekstowe, zaawansowane akordeony, suwaki, referencje, ikony, media społecznościowe, zakładki itp.
  • Działa z dowolnym motywem i wtyczką WordPress
  • Historia zmian pozwala szybko cofnąć wszelkie błędy za pomocą prostego naciśnięcia klawisza
  • Osadzaj posty i filmy z Facebooka na swoich stronach
  • Obsługuje responsywny projekt przyjazny dla urządzeń mobilnych
best wordpress wysiwyg editor

Edytowanie front-endu Elementora

W skrócie

Jest to jeden z najbardziej zaawansowanych kreatorów stron. Mając zobowiązanie do bycia najlepszym edytorem wizualnym WordPress, możesz być pewien ciągłych ulepszeń.

Dużym plusem jest to, że darmowa wersja daje dostęp do około 90% tego, co robi wersja płatna. Jednak Elementorowi brakuje jakiegokolwiek skupienia na konwersji, więc nie jest to najlepszy wybór dla marketerów.

Niektórzy bez wątpienia uważają Elementor za najlepszy edytor WordPress WYSIWYG. Ale jeśli skupiasz się na maksymalizacji konwersji z Twojej witryny, to uważam, że tytuł należy do Thrive Architect.

cennik

  • Bezpłatny
  • Jednorazowa opłata w wysokości 49
Pobierz Elementora

#5 — Rozkwit architekta

W tym miejscu mogę stracić trochę obiektywizmu, ponieważ właśnie przeniosłem się do Thrive Architect (z Site Origin Page Builder) i jestem pod ogromnym wrażeniem!

Thrive Architect jest oparty na poprzednim narzędziu do tworzenia stron Thrive, Thrive Content Builder, który został gruntownie przebudowany i wyposażony w wiele nowych funkcji.

Thrive Architect wyróżnia się na tle innych edytorów wizualnych, ponieważ koncentruje się na konwersji. I właśnie dlatego stał się ulubieńcem blogerów i marketerów.

Thrive Architect zawiera konfigurowalne przyciski, referencje, liczniki czasu i formularze generowania leadów, które integrują się ze wszystkimi głównymi narzędziami do e-mail marketingu.

Jeśli korzystasz już z Thrive Leads, możesz dodać formularze zgody jednym kliknięciem.

Jednym z aspektów Thrive Architect, który absolutnie kocham, jest możliwość skalowania obrazu za pomocą suwaka (w moim poprzednim kreatorze stron po prostu miałeś 5 lub 6 stałych wymiarów):

Inną fajną opcją w Thrive Architect jest możliwość umieszczenia przyciemnionej warstwy na obrazie.

A jeśli naprawdę chcesz przyciągnąć uwagę ludzi, możesz dodać animowane nagłówki (użyłem obu technik na poniższym gifie):

best wordpress wysiwyg editor

Automatyzacja typu Focus Thrive Architect

Edycja front-endowa to absolutna przyjemność – prawdopodobnie najlepsza edycja front-endowa ze wszystkich edytorów wizualnych:

best wp editor

Kolejną rzeczą, którą uwielbiam w Thrive Architect, jest zaawansowane sterowanie cieniami.

Lubię umieszczać cienie wokół moich zrzutów ekranu, aby wyróżniały się z tekstu. W moim poprzednim edytorze nie było na to sposobu, więc cienie dodawałbym w aplikacji graficznej - bardzo czasochłonne.

Z Thrive Architect wystarczy jedno kliknięcie!

best wordpress wysiwyg editor

Sterowanie Drop Shadow w Thrive Architect

Pamiętasz, jak powiedziałem, że Thrive Architect specjalizuje się w konwersji?

Nic dziwnego, że Thrive Architect zawiera potężny kreator stron docelowych.

Oto niektóre z gotowych (ale konfigurowalnych) sekcji, które możesz dodać do swoich stron docelowych:

  • Sekcja Dowodów Społecznych / Świadectwa
  • Sekcja obrazu bohatera
  • Sekcja CTA
  • Sekcja funkcji
  • Jak to działa sekcja
  • Sekcja bonusowa
  • Sekcja Gwarancyjna
  • Lejki sprzedażowe

Oto kilka innych funkcji Thrive Architect:

  • Przyjazny dla urządzeń mobilnych projekt responsywny
  • Wbudowany system szablonów pozwala
  • Zapisz i wczytaj układy
  • Historia zmian i cofnij i
  • Ponów przyciski powoduje korektę
  • zmienia się bryza
  • Stylizowany punktor
  • Listy (takie jak ta)
  • Siatki funkcji (z obrazami lub ikonami)
  • Dynamiczne liczniki czasu
  • Formularze zgłoszeniowe
  • Zdarzenia na stronie - wyświetlaj wyskakujące okienko lightbox na podstawie określonych wyzwalaczy

Zespół Thrive Themes stale dodaje nowe funkcje i nowe funkcje do Thrive Architect. A to gwarantuje, że ten edytor WordPress pozostanie najlepszym edytorem WYSIWYG dla WordPress.

W skrócie

Thrive Architect to idealny kreator stron dla marketerów lub każdego, kto próbuje przekształcić odwiedzających w subskrybentów lub klientów. Thrive Architect specjalizuje się w konwersji i ma więcej narzędzi do konwersji niż jakikolwiek inny kreator stron, którego znam. Thrive Architect jest często porównywany do Elementora pod względem wyglądu i stylu. Ale wolę interfejs użytkownika Thrive Architect od Elementora. Moim zdaniem Thrive Architect to najlepszy edytor WordPress WYSIWYG.

cennik

Thrive Architect jest częścią Thrive Suite, która kosztuje 90 USD na kwartał

Zdobądź Thrive Architect

#6 - Budowniczy bobrów

Z ponad 500 000 aktywnych instalacji Beaver Builder jest jednym z najpopularniejszych kreatorów stron WordPress. Jest to również jeden z najłatwiejszych w użyciu, więc jest doskonałym wyborem dla początkujących blogerów.

Oto niektóre z funkcji oferowanych przez Beaver Builder:

  • Działa z dowolnym motywem WordPress
  • Edycja front-end na żywo — zobacz zmiany w trakcie ich wprowadzania
  • Wsparcie dla widżetów i skrótów WordPress
  • Obsługuje niestandardowe klasy i identyfikatory CSS
  • Jeśli kiedykolwiek odinstalujesz Beaver Builder, Twoje treści zostaną przeniesione do natywnego edytora WP
  • Zoptymalizowany dla urządzeń mobilnych
  • Zawiera dziesiątki gotowych szablonów stron
  • Oferuje moduły do ​​suwaków, karuzeli, teł, bloków treści, przycisków i nie tylko

Muszę powiedzieć; Interfejs użytkownika Beaver Builder wygląda nieco prosto w porównaniu z Elementorem lub Thrive Architect:

W skrócie

Beaver Builder to świetna opcja dla początkujących, ponieważ nie ma świetnej krzywej uczenia się, aby się z tym uporać. Nie oferuje tylu modułów, co niektóre inne kreatory stron. Plusem jest to, że jeśli kiedykolwiek będziesz chciał wrócić do edytora WordPress, Beaver Builder pozostawia po sobie w 100% czysty kod. Dzięki temu będziesz mógł edytować swoje poprzednie posty w edytorze WordPress i większości innych kreatorów stron.

cennik

  • 99 USD w pierwszym roku, a następnie odnawia się z 40% zniżką
Uzyskaj Beaver Builder

#7 - Edytor WordPress Gutenberg

WordPress zawsze był dostarczany z własnym, preinstalowanym edytorem. Ale WordPress niedawno wydał zupełnie nowy i całkowicie darmowy edytor typu „przeciągnij i upuść” o nazwie Gutenberg.

Gutenberg ma bardzo przejrzysty, intuicyjny interfejs użytkownika:

best wordpress wysiwyg editor

Interfejs edytora Gutenberga

Po zainstalowaniu Gutenberga staje się on domyślnym edytorem – nie musisz go wybierać.

Edytor Gutenberga działa na podstawie bloków, które wstawiasz na swoją stronę lub publikujesz, klikając symbol „Plus”:

best wordpress wysiwyg editor

Interfejs edytora Gutenberga

Chociaż Gutenberg jest ogromnym krokiem naprzód w stosunku do edytora TinyMCE o otwartym kodzie źródłowym, który jest preinstalowany z WordPressem, nadal brakuje w nim niektórych zaawansowanych funkcji dostępnych w płatnych programach do tworzenia stron.

Oto próbka bloków dostarczanych z Gutenbergiem

  • Blok podsumowania treści
  • Zaawansowana lista blokowa
  • Blok przycisków
  • Blok obrazu
  • Zaawansowany blok wideo
  • Blok spisu treści
  • Blok Map Google
  • Zaawansowany blok tabeli
  • Blok akordeonowy
  • Blok referencji
  • Blokowanie linków społecznościowych

Chociaż podoba mi się czysty, przejrzysty interfejs, zauważyłem pewne błędy (w wersji, z której korzystałem):

  • Trudno było edytować permalink z poziomu Gutenberga
  • Lista punktowana musi znajdować się w osobnym bloku, w przeciwnym razie cały tekst w bloku zostanie zamieniony na wypunktowanie

Powinienem tutaj wspomnieć, że Gutenberg nie został dobrze zrecenzowany. Na oficjalnej stronie WordPress redaktor Gutenberg otrzymał 1791 recenzji i uzyskał średnią 2,2 gwiazdki na 5.

W skrócie

Gutenberg to elegancki, przejrzysty kreator stron typu „przeciągnij i upuść”. Ale zdecydowanie potrzebuje trochę więcej pracy, zanim zbliży się do konkurowania z którymkolwiek z opisanych powyżej kreatorów stron. Wprawdzie jest bezpłatny, ale Site Origin, Elementor i Visual Composer oferują w pełni działające bezpłatne wersje.

cennik

  • Bezpłatnie (w zestawie z WordPress)

Podsumowanie — najlepszy edytor WordPress WYSIWYG

Kiedy szukałem nowego narzędzia do tworzenia stron WordPress, były to kluczowe funkcje, których szukałem:

  • Łatwy w użyciu interfejs
  • Prawdziwa edycja front-end (tj. zmiany widzisz natychmiast, gdy edytujesz stronę)
  • W pełni responsywny na urządzeniach mobilnych
  • Działa z dowolnym motywem WordPress
  • Obsługuje wszystkie domyślne widżety WordPress
  • System szablonów, dzięki któremu możesz zapisywać niestandardowe elementy i układy oraz ponownie je wykorzystywać
  • Historia zmian, która pozwala szybko wrócić do poprzednich wersji
  • Moduł spisu treści
  • Obsługuje niestandardowe CSS
  • Pozostawia czysty kod

Elementor i Thrive Architect wydawali się być dwoma najbardziej zaawansowanymi kreatorami stron WordPress i obaj spełnili moją listę minimalnych wymagań.

Ostatecznie zdecydowałem się na Thrive Architect z dwóch powodów:

Powód #1

Kiedy edytujesz stronę w Thrive Architect, moduły znajdują się po jednej stronie ekranu, a elementy sterujące dla każdego modułu znajdują się po drugiej stronie ekranu.

Ale w Elementorze moduły i elementy sterujące znajdują się po tej samej stronie ekranu.

Oznacza to, że klikasz o wiele więcej w Elementorze niż w Thrive Architect. W Elementorze, po zakończeniu stylizowania akapitu, nagłówka lub obrazu, musisz kliknąć wstecz, aby przejść do menu modułów.

Natomiast w Thrive Architect moduły nadal są po drugiej stronie ekranu.

Powód #2

Jak większość blogerów, staram się przekształcić odwiedzających w subskrybentów (i ostatecznie w klientów).

Koncentracja Thrive Architect na konwersji była dla mnie decydującym czynnikiem. W Thrive Architect jest więcej modułów związanych z konwersją niż w jakimkolwiek innym narzędziu do tworzenia stron WordPress.

Powiązane artykuły

  • Najlepszy format postów na blogu – 19 wskazówek dotyczących formatowania treści online
  • Jak zorganizować post na blogu – 13 kluczowych elementów
  • Jak napisać swój pierwszy post na blogu