Beaver Builder vs Elementor Pro: który jest najlepszym kreatorem stron WordPress?
Opublikowany: 2021-09-02Próbujesz wybrać między Beaver Builder a Elementor Pro jako narzędziem do tworzenia niestandardowych witryn WordPress za pomocą wizualnego kreatora typu „przeciągnij i upuść”?
Są to dwie najlepsze wtyczki do tworzenia stron WordPress. Oba są również czymś więcej niż tylko kreatorami stron – możesz ich również użyć do pełnego budowania motywów.
A więc – jak możesz między nimi wybierać? Cóż, o tym jest ten post.
Myślę, że obie te wtyczki to doskonałe narzędzia, więc nie ogłoszę ani jednego zwycięzcy. Zamiast tego postaram się pomóc Ci wybrać najlepszą wtyczkę do Twoich potrzeb i budżetu.
Zagłębmy się!
Cechy
Aby rozpocząć nasze porównanie Beaver Builder i Elementor Pro, przyjrzyjmy się na wysokim poziomie funkcjom oferowanym przez oba te narzędzia.
Oto, co oznaczają ikony w poniższej tabeli porównawczej:
- ️ – funkcja dostępna we wtyczce.
- ️️ – funkcja jest dostępna w obu wtyczkach, ale implementacja jednej wtyczki jest bardziej elastyczna/potężna.
- – funkcja nie jest dostępna we wtyczce.
Funkcja | Budowniczy bobrów | Elementor Pro |
Edytor wizualny, front-end | ||
Przeciągnij i upuść | ||
Edycja tekstu w wierszu | ||
Dedykowana edycja responsywna | ||
Widżety treści | ||
Gotowe szablony | ||
Szablony wielokrotnego użytku (własne projekty) | ||
Kreator motywów | * | |
Wstaw zawartość dynamiczną (w tym pola niestandardowe) | * | |
Kreator wyskakujących okienek | ||
Kreator formularzy | ||
Wsparcie WooCommerce | ||
Dedykowany motyw | ||
Białe etykiety | ||
Obsługa wielu witryn | ** | |
Skopiuj/wklej style | ||
Obsługa prawego przycisku myszy | ||
Tryb ciemny (interfejs) |
*Wymaga oficjalnego (ale oddzielnego) dodatku Beaver Themer.
** Elementor Pro wymaga aktywnego klucza licencyjnego dla każdej lokalizacji sieciowej w Twojej sieci wielostanowiskowej.
Beaver Builder kontra Elementor Pro Funkcje Podsumowanie
Pod względem funkcji Elementor Pro ma wyraźną przewagę. Dostajesz…
- Kreator wyskakujących okienek, który jest naprawdę potężną funkcją, która może zastąpić potrzebę osobnej wtyczki popup/opt-in.
- Więcej widżetów do wyboru, w tym unikalne opcje, takie jak przycisk PayPal do przyjmowania płatności.
- Więcej szablonów do wyboru.
- Potężniejszy kreator formularzy.
- Więcej opcji projektowych ( nie opisałem ich w tabeli, ale podzielę się nimi nieco później ).
- Lepsze wsparcie WooCommerce. Beaver Themer obsługuje WooCommerce, ale Elementor Pro zapewnia większą elastyczność w pracy z WooCommerce.
Jednak jedną rzeczą, którą trudno uchwycić w powyższej tabeli porównawczej, jest kompromis między funkcjami a stabilnością. Jeśli chcesz dodać więcej funkcji do narzędzia, musisz mieć szybszy cykl rozwoju, co zwiększa ryzyko błędów lub problemów.
Beaver Builder ma wolniejszy cykl rozwoju, co oznacza, że nie ma aż tylu funkcji. Ale ten wolniejszy cykl rozwoju oznacza, że Beaver Builder jest naprawdę solidny i możesz mieć pewność, że aktualizacja nie spowoduje problemów.
Z pewnością nie mówię, że Elementor Pro jest niestabilny. Jest to najpopularniejsza wtyczka do tworzenia stron i miliony witryn korzystają z niej bez problemu.
Próbuję tylko podkreślić, że stabilność to coś, co Beaver Builder dobrze sobie radzi i zasługuje na uznanie. Jeśli jesteś typem osoby, która ceni stabilność nad zdobywanie większej liczby funkcji, może to być dla Ciebie ważne.
Z drugiej strony, jeśli chcesz mieć najwięcej funkcji i chcesz regularnie uzyskiwać dostęp do nowych funkcji, Elementor Pro zdecydowanie ma przewagę.
Berło
Następnie przyjrzyjmy się, jak interfejs działa z każdym narzędziem.
Jakość interfejsu jest subiektywna, więc nie zamierzam tutaj ogłaszać „zwycięzcy”. Oba narzędzia mają świetne interfejsy i oba są na ogół szybkie i wolne od usterek.
Jedną z zalet Beaver Builder jest to, że pozwala dostosować interfejs do własnych preferencji, podczas gdy interfejs Elementora jest po prostu naprawiony.
Z drugiej strony Elementor ma pewne zalety, ponieważ zapewnia przydatne narzędzia, których nie ma Beaver Builder, takie jak obsługa prawego przycisku myszy i narzędzie nawigacyjne do organizowania projektu.
Budowniczy bobrów
Jak wspomniałem powyżej, interfejs Beaver Builder jest dość elastyczny. Po pierwszym uruchomieniu Beaver Builder zobaczysz pełnoekranowy podgląd swojego projektu z paskiem narzędzi u góry:

Aby wstawić moduły lub szablony, możesz kliknąć ikonę „plus”, aby otworzyć panel:

Podobnie, aby otworzyć ustawienia wiersza, kolumny lub modułu, możesz najechać na nie kursorem i kliknąć klucz, aby otworzyć wyskakujące okienko (które możesz zmieniać i przesuwać w razie potrzeby):

Jeśli wolisz mieć stały panel zamiast ruchomych opcji, możesz przeciągnąć panel na dowolną stronę interfejsu. Spowoduje to utworzenie stałego paska bocznego, na którym możesz dodawać nowe moduły i konfigurować ustawienia dla istniejących elementów:

Jeśli chcesz edytować tekst, możesz po prostu kliknąć i wpisać na stronie lub skorzystać z edytora tekstu w obszarze ustawień.
W przypadku projektowania responsywnego możesz otworzyć tryb edycji responsywnej, który umożliwia wyświetlanie podglądu responsywnego na żywo i dostosowywanie projektu na podstawie urządzenia:

Jedną z funkcji, którą uwielbiam w Beaver Builder, jest możliwość tworzenia projektów wielokolumnowych, po prostu przeciągając jeden moduł obok drugiego:

Większość kreatorów stron zmusza cię do skonfigurowania struktury kolumn przed dodaniem elementów, co daje dodatkowy czas ( Beaver Builder również pozwala to zrobić, jeśli wolisz tę metodę ).
Oprócz tego, co pokazałem powyżej, Beaver Builder oferuje również własną wtyczkę Asystenta, która pomaga szybko przechodzić między projektami ( chociaż nie wymaga Beaver Builder ).
Elementor Pro
Dzięki Elementor i Elementor Pro otrzymujesz stały pasek boczny po lewej stronie interfejsu i podgląd na żywo swojego projektu po prawej:

Jeśli chcesz zobaczyć pełnowymiarowy podgląd swojego projektu, możesz zwinąć pasek boczny, aby ukryć interfejs Elementora:

Na pasku bocznym możesz dodawać nowe moduły i konfigurować ustawienia elementu:

Aby edytować tekst, możesz po prostu kliknąć i pisać na stronie lub użyć edytora tekstu na pasku bocznym.
Elementor zawiera również kilka przydatnych opcji, które pomogą Ci pracować wydajniej. Na przykład Elementor obsługuje kliknięcie prawym przyciskiem myszy, co umożliwia dostęp do kluczowych opcji, takich jak kopiowanie/wklejanie (elementy lub style), duplikowanie elementów i nie tylko.

Dostajesz również narzędzie Nawigator , które pozwala zobaczyć układ strony – możesz również zmieniać nazwy sekcji i elementów na stronie, aby pomóc Ci je zapamiętać i szybko wybrać odpowiedni element:

Elementor Pro zawiera również responsywny tryb edycji, który pokazuje responsywny podgląd i pozwala dostosować projekt dla niektórych urządzeń:

Jeśli chcesz mieć większą kontrolę nad interfejsem Elementora, takim jak Beaver Builder, możesz użyć wtyczki innej firmy, takiej jak Flexible Elementor Panel.
Opcje projektowe
Jeśli interesuje Cię konstruktor wizualny, prawdopodobnie potrzebujesz narzędzia, które pomoże Ci skonfigurować projekt bez potrzeby stosowania niestandardowego CSS. Aby to zrobić, potrzebujesz szerokiej gamy wbudowanych opcji projektowych.
Oba narzędzia są dość elastyczne, jeśli chodzi o podstawy. Możesz łatwo kontrolować:
- Zabarwienie
- Typografia
- Odstępy przez margines/dopełnienie
- Tła
- Elastyczny projekt
- Itp.
Jednak Elementor Pro idzie również dalej niż podstawy, dlatego uważam, że jest to dość wyraźny zwycięzca, jeśli chodzi o elastyczność projektowania.
Zasadniczo, jeśli chodzi o projektowanie, Elementor może zrobić prawie wszystko, co robi Beaver Builder plus „więcej”. Na przykład, oto niektóre z unikalnych funkcji projektowych w Elementor Pro:
- Efekty ruchu — dodaj fajne efekty, takie jak efekty przewijania, pochylanie 3D, śledzenie myszy i inne. Dowiedz się więcej i zobacz przykłady tutaj.
- Pozycjonowanie niestandardowe — używaj pozycjonowania bezwzględnego i względnego, aby idealnie umieszczać widżety w swoich projektach.
- Dodaj CSS bezpośrednio do elementów – możesz dodać CSS bezpośrednio do widżetów/kolumn/sekcji, podczas gdy Beaver Builder pozwala tylko dodać klasę CSS lub identyfikator.
Oczywiście istnieje wiele innych mniejszych opcji i różnic między wtyczkami. Próbuję tylko to podkreślić, ogólnie rzecz biorąc , Elementor Pro zdecydowanie ma więcej opcji projektowych.
Jedynym konstruktorem, który moim zdaniem może rywalizować z Elementorem Pro pod względem wbudowanych opcji projektowania, jest wtyczka Divi Builder (dowiedz się więcej w naszej recenzji Divi).
Występ
Kiedy używasz kreatora stron, zawsze będziesz dokonywał pewnych kompromisów, jeśli chodzi o wydajność. Bez względu na to, który kreator stron wybierzesz, nigdy nie stworzy projektów, które będą tak lekkie, jak natywny edytor WordPress.
Mając to na uwadze, niektóre wtyczki są lepsze od innych.
Beaver Builder zawsze był jedną z lżejszych opcji ( dla kreatora stron ), a zespół Elementora ostatnio kładzie duży nacisk na poprawę wydajności, wprowadzając ulepszenia, takie jak uproszczenie modelu DOM i optymalizacja ładowania zasobów, aby wczytywać skrypty tylko tam, gdzie jest to potrzebne.
Aby ocenić wydajność tych dwóch narzędzi, stworzyłem dla każdego identyczny projekt. Projekt jest dość prosty – staram się tylko zorientować w podstawowej „wadze” każdego narzędzia. Zawiera tylko widżet tekstowy, widżet przycisku i formularz kontaktowy ( z kreatora stron ). Używam ustawień domyślnych w obu narzędziach.
Rozmiar strony | Żądania HTTP | |
Budowniczy bobrów | 71 KB | 11 |
Elementor | 315 KB | 32 |
*Te liczby zawierają mój motyw przewodni, którym jest GeneratePress.
Ogólnie rzecz biorąc, Beaver Builder jest nieco lżejszy, przynajmniej w tym teście. Elementor Pro zapewnia więcej funkcji i efektów projektowych, więc naturalne jest, że aby to osiągnąć, musi załadować więcej zasobów. Na przykład Elementor ładuje skrypty dla swoich efektów ruchu, co jest funkcją, której nie ma Beaver Builder.
Jeśli włączysz nową ulepszoną funkcję ładowania zasobów w Elementorze ( która wciąż jest tylko w fazie testów alfa ), różnica będzie mniejsza, ponieważ Elementor staje się lepszy w ładowaniu tylko niektórych zasobów tam, gdzie są potrzebne:
Rozmiar strony | Żądania HTTP | |
Budowniczy bobrów | 71 KB | 11 |
Elementor | 239 KB | 30 |
A to wszystko bez wtyczek optymalizujących wydajność. Jeśli używasz czegoś takiego jak WP Rocket, możesz jeszcze bardziej obniżyć te liczby.
Sądzę, że podsumowałbym wydajność w ten sposób:
- Beaver Builder jest nieco lżejszy niż Elementor Pro, co ma sens, ponieważ ma mniej funkcji i efektów do załadowania.
- Elementor staje się lepszy, jeśli włączysz nowe funkcje wydajności, które wciąż są testowane, kiedy to piszę.
- Co najważniejsze – możesz stworzyć szybko ładującą się witrynę z obydwoma narzędziami, o ile tworzysz swoje projekty w optymalny sposób i wdrażasz najlepsze praktyki wydajności WordPress.
cennik
Pod względem cenowym oba narzędzia mają pewne zalety. Elementor Pro jest tańszy, jeśli potrzebujesz narzędzia tylko dla jednej witryny lub niewielkiej liczby witryn, podczas gdy Beaver Builder jest tańszy, jeśli potrzebujesz narzędzia dla wielu witryn (ponad 25 witryn).
Zanim jednak będziemy mogli porównać ceny, musisz zastanowić się, jakie są Twoje potrzeby.
Elementor Pro zawiera wszystkie swoje funkcje w jednej wtyczce. Więc kupując Elementor Pro, masz dostęp do wszystkiego – w tym do kreatora motywów, kreatora wyskakujących okienek itp.
Z drugiej strony Beaver Builder oddziela funkcje tworzenia stron i tworzenia motywów.
- Wtyczka Core Beaver Builder Pro – obsługuje tylko tworzenie stron.
- Oficjalny dodatek Beaver Themer – dodaje obsługę pełnego tworzenia motywów ( i wymaga do działania wtyczki do tworzenia stron premium ).
Tak więc z Beaver Builder zapłacisz jedną cenę, jeśli chcesz tylko budować stronę, a inną, jeśli chcesz dodać budowanie motywu.
Kolejną ważną różnicą jest to, że Beaver Builder obsługuje nieograniczoną liczbę witryn we wszystkich planach , podczas gdy wszystkie plany Elementora Pro mają ograniczenia witryn.
Przejrzyjmy ceny każdego z nich, a następnie porównam je i pokażę, kiedy każde narzędzie jest tańsze.
Ceny Elementora Pro
Oto ceny Elementor Pro – wszystkie te ceny dotyczą rocznej licencji:

Ceny konstruktora bobrów
Oto ceny Beaver Builder dla podstawowej wtyczki. Jeśli nie potrzebujesz obsługi wielu witryn lub białych etykiet, myślę, że powinieneś być w porządku z najtańszym planem standardowym 99 USD:

Aby dodać Beaver Themer, zapłacisz kolejne 147 USD (łącznie 246 USD).
W przypadku Beaver Builder i Beaver Themer otrzymasz 40% zniżki, jeśli odnowisz licencję, aby nadal otrzymywać wsparcie i aktualizacje po pierwszym roku.
Kiedy taniej jest kupić Elementor Pro vs Beaver Builder?
Podsumowując wszystkie powyższe informacje, przyjrzyjmy się różnym sytuacjom, w których każde narzędzie jest tańsze:
- Elementor Pro jest o wiele tańszy, jeśli potrzebujesz narzędzia tylko dla jednej witryny (49 USD).
- Jeśli potrzebujesz tylko kreatora stron, progiem rentowności są trzy witryny . Jeśli potrzebujesz narzędzia tylko dla trzech stron internetowych, narzędzia mają tę samą cenę (99 USD). Ale jeśli potrzebujesz więcej niż trzech stron internetowych, Beaver Builder jest tańszy.
- Jeśli potrzebujesz budowania strony i budowania motywów, próg rentowności to 25 stron internetowych . Jeśli masz mniej niż 25 witryn, Elementor Pro jest tańszy. Ale jeśli masz więcej niż 25 stron internetowych, Beaver Builder jest tańszy.
To wszystko są ceny z pierwszego roku. Jeśli odnowisz po pierwszym roku, Beaver Builder będzie tańszy, ponieważ Beaver Builder oferuje 40% zniżki na odnowienie, podczas gdy Elementor Pro nie.
Czy powinieneś używać Beaver Builder lub Elementor Pro?
Myślę, że Beaver Builder i Elementor Pro to dwa z najlepszych (jeśli nie dwa najlepsze ) kreatory stron WordPress, więc nie sądzę, że podejmiesz „złą” decyzję, jeśli chodzi o Beaver Builder vs Elementor Pro.
Zamiast tego myślę, że chodzi tylko o wybranie najlepszego narzędzia dla Twojej sytuacji:
- Jeśli chcesz mieć najwięcej funkcji i opcji projektowych, Elementor Pro jest prawdopodobnie najlepszym wyborem dla Twoich potrzeb. Otrzymujesz unikalne funkcje, takie jak kreator wyskakujących okienek, unikalne opcje projektowania, takie jak efekty ruchu i niestandardowe pozycjonowanie, i nie tylko. Mówiąc najprościej, Elementor Pro jest jednym z najbardziej bogatych w funkcje narzędzi do projektowania WordPress, dlatego jest najpopularniejszą wtyczką do budowania.
- Jeśli chcesz po prostu solidnego konstruktora, który jest nieco lżejszy i ma wszystkie podstawowe opcje tworzenia stron i tworzenia motywów, Beaver Builder jest również doskonałym wyborem.
Tak czy inaczej, będziesz mieć świetne narzędzie, które pomoże Ci stworzyć niesamowite projekty.
Oczywiście jest też inne wyróżnienie, które może odegrać ważną rolę w Twojej decyzji – cena . Pamiętać:
- Elementor Pro jest tańszy w przypadku jednej witryny i równy cenom w przypadku 3 witryn.
- Beaver Builder jest tańszy dla 3+ witryn, jeśli potrzebujesz tylko narzędzia do tworzenia stron LUB 25+ witryn, jeśli potrzebujesz tworzenia stron i tworzenia motywów. W przeciwnym razie Elementor Pro jest nadal tańszy.
- Beaver Builder oferuje 40% zniżki na odnowienie, podczas gdy Elementor Pro nie.
Aby dowiedzieć się więcej o obu wtyczkach, możesz przeczytać nasze pełne recenzje:
- Recenzja Elementora
- Recenzja Beaver Builder
Czy nadal masz jakieś pytania dotyczące Beaver Builder vs Elementor Pro? Daj nam znać w komentarzach!