Elementor PRO 2.10 Animacje Lottie i Multi Step Forms

Elementor Pro w najnowszej wersji, to przede wszystkim dwie nowe funkcje: Lottie Animations i Multi Step Forms. Na temat animacji Lottie jakiś czas temu nagrałem film na kanale YouTube, ale wtedy nie wiedziałem jeszcze, że możliwość renderowania pojawi się natywnie w Elementorze. W dalszej części artykułu film dla tych wszystkich z Was, którzy nie mają Elementora PRO i nie na razie planują jego zakupu, a chcieliby korzystać w nim z tego typu animacji.

Teraz jednak przyglądamy się nowym możliwościom Elementora PRO. Na pierwszym filmie możesz obejrzeć jak zachowują się nowe możliwości.

Lottie Animations

Zacznijmy może od tego czym są animacje Lottie. Najprościej temat ujmując to animacje, które można wyeksportować z programie Adobe Affter Effects do formatu JSON, a które mogą być renderowane przez odpowiednie biblioteki i wyświetlane na naszej stronie jako ruchome obrazy. Przykład:

Popularnym miejscem, gdzie znajdziesz całkiem pokaźną bazę tego typu animacji jest serwis LottieFiles. Wystarczy się zarejestrować, aby otrzymać możliwość pobrania plików json. Potem pozostaje już tylko wykorzystać możliwości nowej wersji Elementora PRO. Ale po kolei.

Pierwsze co trzeba zrobić aby osadzić animację na stronie, to wykorzystać nowy widget Lottie.

Kolejny krok, to załadowanie pobranego wcześniej pliku json lub wybór takiego, który wcześniej trafił do biblioteki mediów WordPress’a. Jeśli nie chcesz ładować pliku bezpośrednio ze swojej strony możesz także wprowadzić jego adres URL.

Dodatkowo w tym miejscu masz także możliwość odpowiedniego wyrównania osadzonej animacji, dorzucenia jej podpisu, a także adresu URL gdzie ma być odesłany użytkownik strony po kliknięciu na animacji. Jednak najwięcej możliwości konfiguracji masz rozwijając zakładkę Ustawienia:

Wyzwalacze (Trigger) pozwalają zdecydować o warunkach jakie muszą wystąpić aby animacja się rozpoczęła. Viewport, OnClick, OnHover i Scroll pozwalają na bardzo dużo na tym polu. Na powyższym filmie możesz obejrzeć jak zachowuje się wyzwalacz scrollowania. Gdy przewijasz stronę animacja trwa, gdy przestajesz ona również zamiera. Fajna zabawa 🙂

Możesz zapętlić animację jeśli chcesz aby trwała w nieskończoność lub żeby zapętliła się tylko określoną ilość razy. Animacja, którą umieściłem powyżej ma właśnie taką niekończącą się pętlę aktywną, dzięki czemu nigdy się nie kończy.

Idąc dalej masz także możliwość uruchomienia animacji od tyłu, co pewnie nie będzie często wykorzystywane, ale pomysłowi designerzy z pewnością zrobią z tej opcji nie raz, nie dwa razy użytek 🙂

Ten rodzaj animacji cieszy się coraz większym zainteresowaniem i nie bez powodu. Wykorzystanie animowanych gifów zwłaszcza jeśli zależy nam na jakości wiąże się z koniecznością wrzucania ciężkich plików. Wykorzystując Lottie, animacje nie tylko są świetnej jakości i skalowalne, ale także znacznie lżejsze.

Jeśli nie masz Elementora PRO, nie martw się ponieważ również w bezpłatnej wersji także możesz łatwo osadzić tego typu animacje. Do tego celu potrzebujesz instalacji dodatkowej wtyczki. Przykład znajdziesz na poniższym filmie:

Multi Step Forms

Na tę funkcję długo czekałem. Zawsze irytowało mnie gdy chcąc uruchomić formularz z kilkoma krokami trzeba było rozglądać się za rozszerzeniami, które taką możliwość oferują. Od teraz nie będzie to już konieczne ponieważ Elementor PRO pozwoli na budowę formularzy składających się z dowolnej ilości etapów.

Wykorzystujesz standardowy widget formularza i jedyne co musisz zrobić, to dodać dodatkowe pole rodzaju “Step” (Krok).

Wszystkie inne pola jakie umieścisz poniżej będą widoczne w kolejnym kroku, a kroków możesz dodać wiele. Jest to przydatne zwłaszcza wtedy, gdy formularz jest dość rozbudowany przez co może zniechęcać do jego wypełnienia. Jeśli go rozbijesz na kilka mniejszych etapów podświadomie stanie się bardziej przyjazny. Oczywiście nie ma to większego sensu jeśli dodajesz formularz kontaktowy z 3 polami, ale jeśli tych pól masz więcej, np. kilkanaście, wtedy wykorzystanie kroków może wpłynąć pozytywnie na współczynnik konwersji, czyli na to ile ostatecznie osób zdecyduje się go wypełnić.

Teraz pozostaje już tylko czekać na kolejną funkcję, a mianowicie na warunki. Tego wciąż mi brakuje.

Podsumowanie

Gdy zacząłem się dłużej zastanawiać, to nie wiem z której nowej funkcji cieszę się bardziej. Chyba częściej wykorzystuję na swoich stronach animacje lottie niż złożone formularze, ale zapewne te również nie raz użyję w prowadzonych kampaniach.

To co jest jednak dla mnie ważne i myślę że dla większości właścicieli stron działających na WordPressie także, to możliwość odstawienia na bok kolejnych wtyczek. Z każdą następną wersją Elementora staje się on coraz wszechstronniejszy. Tak trzymać 🙂

Jeśli wciąż zastanawiasz się nad Elementorem PRO myślę, że coraz więcej przemawia za tym aby w końcu zdecydować się na jego zakup. Informacje znajdziesz pod adresem https://link3.pl/elementor