Jak umieścić animacje Lottie na stronie WordPress

Jak zrobić animację Lottie (JSON) na stronę WordPress.

  1. Odwiedź witrynę Lottie Files https://lottiefiles.com/
  2. Zaloguj się / Zarejestruj na stronie Lottie
  3. Wyszukaj animację 
  4. Wygeneruj kody HTML animacji 
  5. Wstaw animację Lotte na stronę WordPress

1. Odwiedź witrynę Lottie Files https://lottiefiles.com/

2. Logowanie / rejestracja na stronie Lottie

3. Wyszukiwanie animacji Lottie

Aby wyszukać animację Lottie, w panelu „search” wpisz jakiej animacji szukasz, lub wejdź w „Animations -> Recent” . 

animacja lottie wyszukiwanie

Następnie pojawią się przykładowe animacje do wyboru. 

Wybierając jedną z nich, pojawi się okno do konfiguracji animacji oraz do wyboru, sposób w jaki można ściągnąć tą animację.

Parametry jakie możemy ustawić to np:

  • szybkość
  • kolor tła i innych elementów
animacja lottie konfiguracja

4. Generowanie kody HTML animacji Lottie

W tym artukuje pokaże jak umieścić animację za pomocą kodu HTML. Zatem kliknij na przycisk <html>. Zostaniesz przekierowany na stronę gdzie możesz skopiować wygenerowany kod . Skopiuj go, a następnie przyszedł czas, aby umieścić go na naszej stronie www.

animacja lottie code

5. Wstawianie animacji Lotte na stronę WordPress

Wejdź w WordPress na edycję strony lub postu w którym chcesz umieścić animację. Przejdż do edycji w programie Elementor. W wyszukiwarce widgetów wpisz „html”.

Wyszukany widget HTML przeciągni na budowaną stronę. W oknie „Kod HTML” wklej wcześniej skopiowany kod animacji ze strony Lottiefiles.

animacja lottie elementor kod html

Od tej pory możesz podziwiać animację umieszczoną na twojej stronie nie martwiąc się, że plik animacji jest dużych rozmiarów.

Animacja Lottie zajmuje naprawdę mało miejsca, przez co strony ładują się szybko.

Powiadom innych

Zostaw komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *