O Elementorze pisałem wielokrotnie na blogu i niezmiennie od momentu premiery rekomenduję go zarówno swoim Klientom jak i podczas prowadzonych szkoleń kursantom. Nie tylko pozwala na szybkie i bardzo wygodne zarządzanie zawartością strony internetowej, ale także pozwala tworzyć szybko naprawdę atrakcyjne wizualnie witryny.
To obecnie moim zdaniem najlepszy page builder dla WordPress’a i nieustannie umacnia swoją pozycję lidera dzięki rosnącym możliwościom i wersji PRO.
O Elementorze w podstawowej formie przeczytasz np. w artykule Elementor czyli strona internetowa nad którą panujesz. Zerknij rownież na tag Elementor. Dlatego nie będę omawiał podstaw, ale skoncentruję się na kluczowych możliwościach wersji PRO, które sprawiają, że to narzędzie jest w stanie zastąpić praktycznie każdy motyw.
Jakiś czas temu Elementor wykorzystywany był w zasadzie głównie jako narzędzie do zarządzania zawartością poszczególnych stron i artykułów. To co mogliśmy zrobić, to zainstalować motyw, który nam się podobał i przy pomocy Elementora aranżować treści układając je niczym z klocków. Pozwalało to i nadal pozwala tworzyć praktycznie dowolne układy rozmieszczenia poszczególnych obiektów wewnątrz danej podstrony czy artykułu. Działa świetnie!
Ale uwaga… siegając pamięcią wstecz, to począwszy od Elementora Pro w wersji 2.0 możemy nie tylko robić to o czym wspomniałem, ale także zbudować własny layout strony, a więc stworzyć nagłówek strony, stopkę, zdefiniować domyślny wygląd dla artykułów czy archiwów. To był niesamowity krok do przodu, ponieważ praktycznie całkowicie uniezależnił nas od gotowych motywów, które zazwyczaj mają mniej lub bardziej skostniałą strukturę. Jesteśmy niezależni od narzucanych przez nie standardów i to jest coś rewelacyjnego!
To rozwiązanie znajdziesz tylko w wersji Pro, która kosztuje 49 dolarów dla jednej strony. Wersję Pro znajdziesz na stronie www.elementor.com
Ale do rzeczy. Przyjrzyjmy się jak działają funkcje pozwalające na budowę własnego szablonu.
Jak działa builder motywu?
Jako przykład wezmę czystą instalację WP + Elementor + Elementor Pro + Bezpłatny motyw OceanWP. Równie dobrze mógłbym wykorzystać motyw Elementora, który jest dedykowany wersji PRO o sympatycznej nazwie Hello. Motyw ten znajdziesz tutaj. Tymczasem mam stronę “golasa”, która wygląda w ten sposób:
Szału nie ma prawda? Rzeczywiście zainstalowanie świeżego motywu zazwyczaj nie wnosi nic ciekawego. W przypadku OceanWP motyw jest niezły i oferuje Ci ogromną ilość opcji konfiguracyjnych w wersji bezpłatnej i dobrze współpracuje z Elementorem.
Tam gdzie powyżej widzimy napis Chcesz opublikować swój pierwszy wpis?… to obszar, który w Elementorze możemy dowolnie komponować. Jednak w wersji darmowej nie mamy wpływu na to jak będzie wyglądał nagłówek i stopka strony. Te obszary strony w przypadku pracy z Elementorem bezpłatnym zależne są do szablonu jaki wybraliśmy.
Oczywiście można posiłkować się dodatkowymi wtyczkami, które pozwolą tworzyć nagłówek i stopkę, ale to tylko czubek góry lodowej możliwości jakie dostajemy z Elementorem PRO, a poza tym dbałość o stronę to także minimalizowanie ilości instalowanych wtyczek.
Na siłę w darmowym Elementorze można stworzyć nagłówek czy stopkę standardowo jako sekcję, ale żeby ją ulokować tam gdzie chcemy trzeba dodawać ją ręcznie do każdej podstrony czy artykułu witryny. Mało komfortowe zwłaszcza gdy za jakiś czas przyjdzie Ci coś w tych miejscach zmienić 🙂
Ta ułomność jest niestety dość kłopotliwa i mało praktyczna zwłaszcza jeśli nasza strona będzie miała większą ilość podstron, nie mówiąc o dziale z artykułami (Blog). Elementor Pro pozwala stworzyć sekcję nagłówka i stopki, które z automatu zostaną wyświetlone na wszystkich podstronach naszej witryny.
Aby zrobić to o czym piszę musimy skorzystać z narzędzia Theme Builder. Żeby stworzyć nowy nagłówek wchodzimy do sekcji Szablony > Theme Builder
Nie mamy jeszcze utworzonego żadnego szablonu więc jedyną opcją jaka mamy to jego dodanie. Tak też robię klikając w przycisk “Dodaj nowy template”. Następnie wybieram z listy rodzaj templatki. Chcę najpierw utworzyć nagłówek strony, więc stosownie do moich zamiarów wybieram właśnie tę opcję:
W polu nazwy wpisuję coś co będzie identyfikowało templatkę na liście (bez obawy ta nazwa nie wyświetli sie na stronie) i klikam w przycisk utworzenia szablonu.
W momencie gdy zainicjujesz budowę nagłówka pojawią się przykładowe, gotowe propozycje graficzne jego aranżacji. Na obecną chwilę jest ich 31 sztuk, ale każdy z nich możesz indywidualnie modyfikować lub jeśli wolisz, możesz stworzyć cały nagłówek samodzielnie od podstaw.
Jeśli ta ilość gotowych propozycji to dla Ciebie za mało, koniecznie sprawdź ten artykuł: “2000+ bezpłatnych szablonów dla Elementora“. Dysponując Elementorem PRO masz dostęp do olbrzymiej ilości templatek 🙂
Ok żeby użyć templatki nagłówka, która wstępnie mi odpowiada (dalej mogę ją dostosować jak chcę) klikam na niej i wstawiam do szablonu.
Domyślnie schemat jaki wybrałem wykorzystuje dwa widgety. Jeden to widget logotypu, drugi to widget odpowiadający za wyświetlenie menu.
Jak widzisz obszar, który odpowiada za wyświetlenie logotypu, a także menu nie wyświetla nic ciekawego. Wynika to z faktu, że dla strony nie zdefiniowałem ani logotypu, ani menu. Jeśli więc utworzę menu sprawa będzie wyglądała inaczej 🙂
Przyjmijmy, że nagłówek już sobie odpowiednio zaaranżowaliśmy. Tak jak wspomniałem możesz w nim zmienić dosłownie wszystko od układu, po kolory, możesz dodawać kolejne widgety odpowiadające za wyświetlanie treści, przycisków, ikon itd…
Żeby zapisać pracę i jednocześnie opublikować nowy nagłówek wystarczy, że kliknę w przycisk Opublikuj, który znajdę standardowo w lewym dolnym rogu okna przeglądarki, na samym dole paska z widgetami Elementora.
To jednak nie koniec, bo teraz będzie najciekawsze 🙂
Mogę zdecydować gdzie nagłówek ma się wyświetlać. Innymi słowy czy chcę zastąpić domyślny nagłówek motywu na całej witrynie czy może tylko w wybranych jej obszarach.
Tu chwilę się zatrzymam, ponieważ jest to niesamowita funkcjonalność Elementora PRO.
Zazwyczaj jest tak, że nagłówek strony jest wspólny, tzn. taki sam na każdej stronie i podstronie naszej witryny. Bywają jednak sytuacje, gdy możemy zechcieć wprowadzić troszeczkę więcej różnorodności do naszej strony.
Załóżmy że na stronie mamy bloga, który porusza kilka obszarów naszej działalności. Każdy z tych obszarów czymś się charakteryzuje. Możemy wpaść na pomysł, aby dział prezentujący artykuły z danej tematyki wyróżniał się na tle pozostałych chociażby jakimś charakterystycznym akcentem graficznym w nagłówku, może inna kolorystyka itp…
Mając do dyspozycji Elementora PRO mogę ten pomysł wcielić w życie i nie muszę dotykać choćby linijki kodu!
Zwróć uwagę, że warunki wyświetlania mogą być rozbudowane. W naszym przykładzie powyżej, konfiguracja sprawi, że ten schemat nagłówka będzie wyświetlał się w całym serwisie, za wyjątkiem wpisów przypisanych do wybranej kategorii, oraz na stronie wyświetlającej błąd 404 (strona nie istnieje). Rewelacja 🙂
Gdy już mam zdefiniowane warunki wyświetlania zapisuję zmiany i mogę przejść na stronę, aby sprawdzić czy domyślny nagłówek motywu został zastąpiony. Owszem został.
Zrobimy więc dokładnie ten sam zabieg ze stopką strony. Procedura jest identyczna. Różni się jedynie tym, że na etapie definiowania rodzaju tworzonego szablonu zamiast nagłówka wybieram stopkę.
Gotowych templatek dla stopki mam nieco więcej i podobnie jak w przypadku nagłówka stopkę mogę dowolnie modelować pod własne potrzeby.
Wybieram templatkę, dostosowuję ją do własnych potrzeb, zapisuję i określam warunki wyświetlania – wszystko dokładnie tak samo jak w przypadku nagłówka. Na koniec sprawdzam efekt, który może prezentować się jak poniżej lub zupełnie inaczej, bo na pewno będziesz miał swój własny pomysł 🙂
Po starym nagłówku i starej stopce ani śladu. To co teraz pozostaje, to już praca z treścią poszczególnych stron i podstron i tu również możemy wykorzystać Elementora Pro.
Mógłbyś zatem zapytać czy w tej sytuacji jest sens inwestować w motywy? Odpowiem tak. W dobry motyw dobrze zoptymalizowany pod katem Elementora warto ponieważ doda on jeszcze większego wiatru w żagle naszej strony. Polecam Twojej uwadze takie motywy jak Astra, Kadence, Blocksy i GeneratePress. Przeczytasz o nich w artykule: Najlepsze motywy WordPress.
To nie jedyne wyjątkowe możliwości jakie niesie ze sobą Elementor Pro.
Kolejna świetna funkcjonalność to chociażby builder formularzy czy generator okien popup, które można wykorzystać na setki rozmaitych sposobów. To także możliwość umieszczania utworzonych templatek przy wykorzystaniu shortcodów w dowolnym miejscu artykułu czy strony. Jeśli pracujesz z edytorem Gutenberg to bez problemu wstrzyknięta do niego bloki z Elementora PRO. To także świetne efekty wizualne i wiele innych drobniejszych funkcjonalności, które sprawiają że w rękach mamy potężne narzędzie.
Trzeba jednak nauczyć się z nim pracować i wykorzystywać jego potencjał. Elementor rozwija się bardzo dynamicznie. Dla Czytelników JZS dostępny jest specjalny Kurs Elementor PRO na platformie PoznajWP. Zapraszam!
Mam pytanie dotyczące Elementora Pro. Czy wtyczki można użyć na istniejącej już od dłuższego czasu stronie? Czy ona nie zepsuje dotychczasowych ustawień na stronie. Czy można w spokoju modyfikować poszczególne podstrony, elementy istniejącej strony bez obawy uszkodzenia wszystkich istniejących stworzonych już wartości, danych, podstron na stronie? Z góry dziękuję za odpowiedz, proszę o wyrozumiałość ponieważ jestem Amatorem w świecie wordPress.
Jak rozumiem masz Elementora darmowego i teraz chcesz dołożyć Elementora PRO. Jeśli tak to nic się nie zmieni po dodaniu tej wtyczki także spokojnie możesz działać. Otrzymasz tylko dodatkowe widgety i inne możliwości jakie Elementor w wersji PRO oferuje.
Czy jest możliwość w Elementorze stworzyć kilka szablonów dla kilku produktów i używać ich jednocześnie.
Chciałem zrobić coś takiego na jednym sklepie Woocomerce
przykładowySklep.pl/produkt/klawiatura – szablon nr 1
przykładowySklep.pl/produkt/joystick – szablon nr 2
przykładowySklep.pl/produkt/myszka – szablon nr 3
Tak, żeby graficznie to wyglądało na 3 różne sklepy
Dziękuje
Niestety póki co nie ma takiej możliwości. Można ewentualnie edytować w elmemencorze opis, ale główny layout jest dla wszystkich produktów, ewentualnie można zmieniać szablony bazując na kategoriach.
Dziękuję Krzysztof. Jednak zastanawiam się jak zatem radzić sobie z klientami dla których robię stronę w oparciu o elementor pro. Licencja jest na mnie to rozumiem że raz do roku wystawiam fakturę za wznowienie elementor pro? Coś jak odnowienie serwera i domeny? Czy możesz naświelić jak sobie z tym faktem radzić?
Przede wszystkim muszą być świadomi faktu, że jest to rozszerzenia płatne i z tego tytułu ponosisz corocznie koszty. Możesz umówić się z nimi na jakąś drobną opłatę, która pozwoli Ci utrzymać wtyczkę każdego roku, albo po prostu powiedzieć, że od Ciebie dostają wtyczkę bezpłatnie na rok, a po roku żeby z niej korzystać powinni zakupić własną licencję za te 49 dolarów. Tu nie ma się co czaić. Takie narzędzia są po prostu płatne i tyle.
Jeśli chcesz mieć coś co będzie generowało niskie koszty czy wręcz zerowe jeśli skorzystasz z oferty Lifetime, zajrzyj na ten kreator: Zion Builder lub Bricks. Oba bardzo fajne 🙂
Elementor przypomina w obsłudze stary, darmowy edytor tekstu. Nie da się wygodnie edytować i tworzyć wpisów, justować tekstu itd.
Wypadaloby w XXI w. dopracować tak podstawowy element.
A co oznacza przy cenie elementora pro informacja na rok? Póki utrzymuję stronę, co rok muszę dokonywać tej płatności?
Przymusu nie ma. Jeśli nie przedłużysz licencji nie będziesz miała dostępu do kolejnych aktualizacji wtyczki, do wsparcia producenta czy do templatek PRO, ale to co masz na obecną chwilę działać będzie. Kupując jakąkolwiek wtyczkę, motyw, itp. kupujesz licencję na określony czas – zazwyczaj rok. Wyjątkiem są oferty lifetime, które można spotkać u niektórych twórców, ale jak nietrudno się domyślić są one odpowiednio droższe.
Witam. Pytanie. Przypuśćmy, że robię klientowi stronę na wersji elementora pro. Wszystko działa przez rok. Klient sam zarządza stroną. Jednak po roku nie opłaca wersji pro. Co wtedy? Nadal ma wersję pro Czy z automatu zmienia mu się w darmową? Nadal mu wszystko działa? Tylko nie ma aktualizacji?
Cześć Przemku. Kiedyś nie było dostępu tylko do aktualizacji, teraz nie ma dostępu także do biblioteki szablonów i mogą zostać wyłączone widgety pro, choć te które już użyłeś powinny nadal działać. Możesz to łatwo sprawdzić. Aktywuj licencję Elementora poukładaj na stronie widgety pro, a potem licencję ze strony usuń. Zobaczysz wówczas jaki jest efekt.
Krzysiek, czy jest sens instalować tą popularnę wtyczkę “Elementor – Header, Footer & Blocks” jeżeli już posiadam Elementora Pro? https://wordpress.org/plugins/header-footer-elementor/
Czy zyskujemy coś dodatkowgo dzięki tej wtyczce ?
Wtyczka ta spowolni tylko naszą stronę?
Nie ma to większego sensu. Nie instaluj 🙂
Chciałbym zmienić ponad 400 wpisów dodając do nich szablon stworzony w Elementorze. Czy można to w jakiś sposób zautomatyzować?
Jeśli masz Elementora PRO to tworzysz szablon dla wpisów, zapisujesz i wszystkie zaczynają z niego korzystać.
Witam Czy zatem opłaca się jeszcze uczyć tworzyć własne szablony pod WordPressa ? Uczyć się Html/Css/Php skoro jest Elementor ?
Damian ta wiedza pozwoli Ci wchodzić głębiej w niestandardowe rozwiązania czy chociażby lepiej rozumieć pewne mechanizmy (np. techniczne SEO). Nie jest to jednak wiedza niezbędna czy konieczna do tego aby samodzielnie stworzyć atrakcyjną stronę, sklep lub bloga.
Bardzo dobry artykuł. Właśnie się zastanawiam nad Elementorem lub WPBakery do tworzenia stron dla klientów. Czy WPBakery też posiada licencję na X stron? Tak jak Elementor w wersji Pro 1000?
Nie mam osobiście najlepszych doświadczeń z tym builderem (mowa o WPBakery) więc nie polecam. Odnośnie licencji WPBakery, to jeden zakup (licencja) = jedna strona.
Jestem zupełnie świeży więc moje pytanie może zabrzmieć trochę dziwnie.
Czy, żeby zainstalować Elementora a następnie Elementora Pro, muszę po zainstalowaniu aktualnej wersji WP na serwerze pozbyć się Gutenberga tj. zainstalować wtyczkę klasycznego edytora?
Nie Karol. Nie musisz odinstalowywać niczego. Możesz potem decydować czy z daną podstronę, artykułem itd… chcesz pracować wykorzystując Gutenberga czy Elementora.
znikł mi przycisk Edytuj w Elementorze w darmowej wersji.Przełącznik w ustawieniach jest włączony. WP 5 i gutenberg.Jak go przywrócić? Strony mają możliwość edycji linkiem, ale przycisku nie ma
dopiero zaczynam go próbować.
Próbowałeś wyczyścić cache przeglądarki?
tak, usunąłem też Elementora i zainstalowałem ponownie i to samo. Przedtem czyściłem wordpressa, Firefoxa i Google
Nie wiem, czy to jest to, ale wyłączyłem gutenberga, przeczyściłem cache i włączyłem i przycisk się pojawił. Nie wiedziałem, że tak się gryzą
Elementor i Gutenberg się nie gryzą, coś gdzieś musiało nie zaskoczyć.
była dodawana nowa strona w wp i jak zwykle pojawiał się wybór, a tymczasem nic też na wszystkich utworzonych do tej pory, a to dobra para była z darmowym elementorem..Nie wiem co było, spróbowałem wtyczkami i zaskoczyło, windows
Elementor jest super ale ja mam w jednym miejscu problem dość irytujący bo wtyczka comparision image za nic nie chce się wyświetlać poprawnie to jest dodatek typu after befor zdjęcia są różnej wielkości i d… Mógłbyś pomóc?
Nie napisałeś co to znaczy, że nie chce wyświetlać poprawnie. Jak rozumiem nie wyświetla obrazków, albo wyświetla je w sposób który Ci nie odpowiada. Nie wiem też jakiej konkretnie wtyczki używasz, a jest ich tego typu sporo. Przede wszystkim w przypadku takich dodatków obrazki najlepiej jeśli mają te same rozmiary. Możliwe też, że jest jakiś konflikt z innym rozszerzeniem, albo motywem z którego korzystasz. Spróbuj wyłączyć wtyczki, przełącz się na innym motyw i sprawdź czy pomogło. W ten sposób wyselekcjonujesz winowajcę.
Mam pewien problem z Elementorem. Jest super – fakt. Dla swojej własnej strony/sklepu – mogę przedłużać co roku licencję. Jednak problem jest gdy chce się używać Elementor Pro pod wdrożenia dla klientów. Klienci nie chcą ponosić stałych opłat co roku, a jeśli ktoś im wdroży na Elementor Pro coś i nie powiadomi o takiej konieczności, naraża klienta na problemy związane z bezpieczeństwem, gdyby wykryto we wtyczce jakiś bug, który został załatany w którejś z aktualizacji, a której to klient nie uzyska bo nie ma przedłużonej licencji. Dlatego w DIVI inaczej to rozwiązano – i to jest lepsze 🙁
DIVI ma licencje typu Lifetime czego Elementor, przynajmniej na razie nie oferuje. Fajnie by było gdyby taka opcja kiedyś się pojawiła 🙂 Natomiast developerzy, którzy widzą potencjał Elementora i niezwykłą wygodę w pracy z tym narzędziem jakiej doświadczają końcowi użytkownicy (ich Klienci), po prostu odnawiają swoją licencję rok w rok i nie ma problemu. Jeśli Klient trafi na niezbyt odpowiedzialnego projektanta, to nawet gdy ten nie odnowi swojej licencji świat się nie wali. Strony nadal działają tyle że nie ma dostępu do nowych wersji Elementora PRO.
Nie musisz kupować licencji Elementor Pro, bo są na rynku pluginy / rozszerzenia, które dają Ci więcej funkcji niż Elementor Pro i są z licencjami lifetime / developer free update. Ja sam mam licencję Elementor Pro i używam jej tylko na kilku stronach klientów. Więcej używam dodatków pro do Elementora.
Wszystko zależy od potrzeb. Elementor PRO można by rzec, to natywne rozwiązanie pochodzące od jego producenta, a więc także jakość kodu jest tu przewidywalna co nie jest bez znaczenia. Sporo zewnętrznych rozszerzeń, to w dużej mierze widgety. Korzystając z Elementora PRO zasilasz projekt chociażby theme builderem czy dynamicznymi danymi czego wielu innym brakuje. Można oczywiście posiłkować się np. Crocoblock i ich rozszerzeniem JetEngine, ale tak jak napisałem to zawsze wybór indywidualny i powinien być podejmowany w świadomy sposób. Nie sztuką jest naszpikować Elementora i samego WP dziesiątkami rozszerzeń, pytanie tylko po co 🙂
Problemem jest to, że klienci nie chcą płacić za przyszłe aktualizacje. Chcą kupić “narzędzie”z wieczystymi aktualizacjami. Za Elementora Pro trzeba płacić co roku, więc musiałem znaleźć inne rozwiązanie. Tylko kij ma dwa końce klient chce zapłacić tylko raz a potem nie robi aktualizacji….
Zastanawiam się, czy jeżeli ma się kilka licencji, które wygasną a chce się zrobić nową stronę w PRO – to trzeba odświeżyć wszystkie licencje, czy można tylko kupić jedną – nową ?
Nikt Ci nie opowie. Artykuł stworzony tylko pewnie jako płatny wpis, albo autor z reflnka ma kasę za Twój zakup.
Tomku każdy może odpowiedzieć na zadane w komentarzach pytania, nie tylko ja, ale Ty również. Szkoda, że mając taką szansę nie udzieliłeś konkretnej odpowiedzi. A przecież mogłeś 🙂 A tak na poważnie, to jeśli ktoś ma pytanie kierowane bezpośrednio do mnie zawsze można wysłać je mailem (kontakt w stopce).
Co do pytania Archisa, to pojedyncza licencja umożliwia instalację rozszerzenia PRO na jednej stronie, ale dostępne są licencje na większą ilość stron. Masz do wyboru licencję dla jednej strony, trzech lub licencje nielimitowaną. Jeśli więc masz więcej niż 3 strony zapewne bardziej będzie Ci się kalkulowało zainwestować w wersję unlimited zwłaszcza jeśli po drodze pojawią się kolejne strony. Kwestia indywidualnej kalkulacji.
Jeszcze brakuje informacji o artykule sponsorowanym. Ale to szczegół, prawda ?
Nic nie brakuje Tomku. To nie jest artykuł sponsorowany.
Elementor jest bardzo fajną wtyczką. 😉
Zaczęłam bawić się visual composer, ale działa pewnie podobnie ja elementor. Na stronie głównej mam blog którego nie mogę edytować. Wie Pan może jak podmienić główną stronę (blog) na stronę stworzoną w kreatorze? Czy może coś robię nie tak?
Tak VC to także builder tyle że z dłuższą historią niż Elementor. Wejdź w Ustawienia > Czytanie, zaznacz Statyczną stronę i wybierz z listy tą która ma być stroną główną. Zapisz zmiany i to powinno temat załatwić.
Cześć, czy mając elementor pro będę mógł tworzyć menu w formie przycisków jak na tym zdjęciu? : https://images.app.goo.gl/H4JwW8vGUu1kVaHJ8
Adrian w Elementorze możesz zrobić praktycznie co chcesz. Jeśli zechcesz umieścić przyciski jeden obok drugiego robiąc w ten sposób swoiste menu, to jak najbardziej jest to możliwe.
Dokładnie o to mi chodzi, czy mogę poprosić o jakąś wskazówkę? Pozdrawiam, Adrian
Najpierw zajrzyj czy motyw z jakim pracujesz ma możliwość tworzenia MegaMenu jeśli tak i pozwala na wykorzystywanie szablonów z Elementora to pracujesz z takim menu jak z dowolną stroną opartą na Elementarze. Jeśli nie masz takiej możliwości, albo korzystasz z Theme Buildera do budowy nagłówka z Menu, wówczas zerknij na ten tekst: https://elementor.com/blog/wordpress-mega-menu/