Elementor WordPress – poradnik

Elementor WordPress Poradnik

Jeszcze jakiś czas temu możliwość tworzenia stron internetowych zarezerwowana była dla osób, które dostatecznie dobrze znały język HTML i dysponowały wiedzą z zakresu programowania. Dążenie do uproszczenia procesu budowania strony doprowadziło do pojawiania się specjalnych kreatorów, które nie wymagają od użytkownika umiejętności kodowania. Jednym z takich kreatorów jest Elementor WordPress, czyli wtyczka, za pomocą której można utworzyć całą stronę wraz z nawigacją i stopką. Elementor cieszy się dużą popularnością wśród użytkowników ze względu na łatwą obsługę i funkcjonalność. W artykule podpowiadamy, jak zrobić stronę na WordPress przy użyciu popularnej wtyczki.

WordPress Elementor – podstawowe informacje

Zacznijmy od podstawowych informacji dotyczących Elementora. Wtyczka dostępna jest w dwóch wersjach: Elementor (wersji bezpłatnej) i Elementor Pro (wersji płatnej). Druga z nich jest oczywiście funkcjonalnie bogatsza i oferuje m.in. dodatkowe widżety, a także – co istotne – możliwość budowania szablonów WordPress od postaw.
Plugin wyposażony został w funkcję live preview, która umożliwia podgląd strony w trakcie tworzenia. Dana strona może być tworzona z myślą o trzech wielkościach ekranu: desktop, tablet i mobile. Projektując stronę, można na bieżąco sprawdzać, jak wygląda ona przy danej wielkości.

Elementor WordPress responsywne
Elementor: edycja elementu dla desktop, tablet i mobile.

Jak zrobić stronę na WordPress przy użyciu Elementora?

udując bądź edytując stronę za pomocą Elementora, korzystamy z gotowych elementów, które wybierać możemy zgodnie z własnymi preferencjami. W wersji darmowej jest ich kilkadziesiąt. Do dyspozycji użytkownika pozostają m.in.:

  • pole tekstowe,
  • nagłówek,
  • obrazek,
  • karuzela obrazów,
  • wypunktowana lista,
  • podstawowa galeria,
  • mapka Google,
  • licznik,
  • pasek postępu,
  • alert,
  • ikonki mediów społecznościowych,
  • referencje,
  • opinie,
  • zakotwiczenie menu czy panel boczny.

Aby umieścić dany element, wystarczy złapać go i przeciągnąć do pola roboczego. W każdej chwili możemy przy tym zmienić widok i sprawdzić, jak nasza strona prezentuje się na urządzeniach mobilnych: tabletach i telefonach. Jeśli okaże się, że dana funkcjonalność nie wygląda zadowalająco w wersji mobilnej, możemy natychmiast ją poprawić

WordPress Elementor – sekcje i kolumny

Tworzona przez nas strona każdorazowo składa się z sekcji, zajmujących całą szerokość ekranu, i kolumn – to w nich umieszczane są wybrane przez nas elementy. Co istotne, zarówno sekcje, jak i kolumny podlegają personalizacji – użytkownik może zdecydować np. o szerokości kolumn, wyborze tła czy wielkości marginesów.
Edytor sekcji i kolumn obejmuje trzy zakładki, tj. Wygląd, Style i Zaawansowane.

W zakładce Wygląd ustawiamy np. szerokość i wysokość sekcji i kolumn. W zakładce Style można wybrać m.in. kolor tła czy font. Z kolei w zakładce Zaawansowane możliwe jest np. określenie odstępów czy animacji wejścia poszczególnych elementów.

Nawigator i historia edycji, czyli przydatne funkcje WordPress Elementor

Gdy już utworzymy sekcje i kolumny i wybierzemy interesujące nas elementy, może się okazać, że dalsza edycja strony jest utrudniona z powodu dużej liczby funkcjonalności. Wówczas z pomocą przyjdzie nam nawigator zawierający listę wszystkich elementów znajdujących się aktualnie na stronie. Dzięki nawigatorowi szybko odnajdziemy element, który zamierzamy edytować.
Przydatna w trakcie tworzenia czy edytowania strony okaże się również możliwość powrotu do wcześniejszych wersji edycji. Wersje te znajdziemy w oknie Historia, składającym się z dwóch zakładek:

  • Akcje – gdzie możemy przywrócić wcześniejszą wersję danego elementu,
  • Wersje – gdzie mamy możliwość przywrócenia wcześniejszej wersji strony.

Jak stworzyć szablon WordPress przy użyciu Elementora?

Jak powiedzieliśmy, Elementor WordPress dostępny jest nie tylko w wersji darmowej, ale również płatnej, tj. Elementor Pro. Jedynie wersja płatna daje użytkownikowi możliwość tworzenia od podstaw zindywidualizowanych szablonów stron internetowych. Aby rozpocząć tworzenie szablonu, należy skorzystać z narzędzia Theme builder. Na początku powinniśmy wybrać z listy rodzaj szablonu, który zamierzamy utworzyć (np. strona, nagłówek, stopka, archiwum).
Dany szablon możemy zaprojektować od postaw bądź też uczynić podstawą naszego projektu jedną z dostępnych templatek i dostosować ją do indywidualnych potrzeb. Zakres dostępnych dla użytkownika modyfikacji jest bardzo szeroki i obejmuje np. układ szablonu, kolory, widgety czy ikony. Tworzenie szablonu WordPress przy użyciu Elementora jest przy tym naprawdę łatwe i nawet niedoświadczonemu użytkownikowi nie powinno nastręczyć większych kłopotów.

Jak wstawić widżet BUY.BOX w Elementorze

Kreator Elementor, pozwala nam na dodawanie wielu elementów poza podstawowym edytorem treści. Możemy dodać obraz, ikonkę, przycisk czy film. Finalnie, wszystkie te elementy stworzą nam piękną całość.

Jeżeli będziemy chcieli na naszej podstronie dodać widżet BUY.BOX, na przykład gdzieś w treści, wówczas wystarczy dodać element </HTML> (w polu Szukaj wpisz HTML, a system od razu znajdzie nam element) i wkleić kod wygenerowany w panelu.

Kroki dodawania widżetu

  1. Przejdź w panelu WordPressa do strony, którą chcesz edytować.
  2. Kliknij w poszczególną sekcję. Opcja Nawigator ułatwi Tobie poruszanie się po sekcjach.
Nawigator HTML element
Nawigator: Element </> HTML dodany w wybranej sekcji.

3. Zjedź na dół strony, kliknij plusik + i dodaj kolejną sekcję.
4. Następnie, w polu Szukaj wpisz HTML, wybierze element </> HTML, a następnie przenieś element do sekcji.
5. W pole HTML wklej kod wygenerowany z panelu BUY.BOX.
6. Przenieś element HTML w miejsce, gdzie widżet ma się wyświetlać. Dzięki opcji Nawigator łatwo przesuniesz element w pożądane miejsce.

Pamiętajcie, że tak jak konkretna strona nie musi być nudna, tak i tutaj możemy bawić się różnymi formami widżetu. Zobacz live demo strony z BUY.BOXem w roli głównej.

Widżet popover
Przykład widżetu w wersji popover w treści recenzji książki na blogu.

Elementor WordPress, czyli kreator stron dla każdego

Wtyczka Elementor jest rozbudowanym narzędziem do tworzenia stron internetowych. Osoby, które potrzebują wielu zróżnicowanych funkcjonalności lub cenią sobie możliwość spersonalizowania szablonu, powinny rozważyć zakup wersji płatnej wtyczki. Należy jednak pamiętać, że również wersja darmowa z pewnością okaże się użyteczna – zwłaszcza jeśli wykażemy się kreatywnością. Dostarcza ona bowiem większość potrzebnych widgetów do budowy funkcjonalnej i estetycznej strony w WordPress.

Udostępnij na:

Facebook
Twitter
LinkedIn
Email
Joanna Kaczmarek

Joanna Kaczmarek

Chief Marketing Officer. Od wielu lat związana z branżą internetową. Aktywnie zaangażowana w rynek wydawców i afiliacji.

Najnowsze wpisy

Monetyzuj swoje treści skuteczniej

Tylko kilka minut dzieli Cię to tego, żeby zacząć zmieniać swoich odbiorców w kupujących i zarabiać na prowizjach od sprzedaży.