Spis treści
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.
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
- Przejdź w panelu WordPressa do strony, którą chcesz edytować.
- Kliknij w poszczególną sekcję. Opcja Nawigator ułatwi Tobie poruszanie się po sekcjach.
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.
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.
Podziel się
