Czy widziałeś te piękne animacje CSS na popularnych stronach internetowych? Efekty animacji, takie jak zawartość, która się ślizga, która się rozprasza, odbijające się obrazy itp. ? Czy chcesz również dodać animacje CSS do WordPress?

W tym artykule pokażemy, jak łatwo dodawać animacje CSS do WordPress bez pisania kodu.

Kiedy i dlaczego powinieneś używać animacji CSS?

Animacje CSS pozwalają zwrócić uwagę użytkownika na różne części strony. Możesz ich użyć do animacji funkcji produktu lub przycisku wezwania do działania. Wiele witryn używa animacji CSS, gdy użytkownik przewija stronę w dół. Dodaje stronie charakteru i podkreśla najważniejsze elementy.

Animacje CSS są również szybsze niż przy użyciu Flasha lub filmów. Ładują się szybko i są obsługiwane przez większość nowoczesnych przeglądarek internetowych. Możesz ręcznie dodać animacje CSS do motywu WordPress lub arkusza stylów. motyw dla dzieci, Jednak większość początkujących nie chce edytować plików motywów ani uczyć się CSS.

To powiedziawszy, w tym samouczku zobaczymy, jak możesz łatwo dodawać animacje CSS do swojej witryny WordPress.

Ale wcześniej, jeśli nigdy nie instalowałeś WordPress, odkryj Jak zainstalować WordPress blogu kroki 7 et Jak znaleźć, zainstalować i aktywować WordPress na swoim blogu 

Wróćmy do tego, dlaczego tu jesteśmy.

Jak skonfigurować animacje CSS

W tym samouczku użyjemy wtyczki. Pozwala tworzyć animacje CSS za pomocą Edytor wizualny WYSIWYG. Pierwszą rzeczą, którą musisz zrobić, to zainstalować i aktywować wtyczkę Animowanie go!. Wtyczka działa bez konfiguracji i nie ma panelu sterowania.

Odkrywaj Jak zainstalować wtyczkę w WordPress jeśli nigdy tego nie robiłeś.

Po prostu utwórz nowy post, a zobaczysz nowy przycisk na pasku narzędzi edytora wizualnego.

dodaj animacje CSS na WordPress - animateit-button

Po kliknięciu przycisku zobaczysz nowe okno, w którym możesz zaprojektować swoje animacje CSS. Wtyczka obsługuje wiele animacji CSS, z których można wybierać.

Animacja-redaktor

Najpierw musisz wybrać styl animacji. Następnie musisz wybrać czas oczekiwania przed animacją i czas trwania animacji. Na koniec możesz określić, kiedy rozpocznie się animacja.

Idź dalej, odkrywając Jak dodać imponujące animacje na swoim blogu

Wtyczka oferuje trzy opcje. Możesz uruchomić animację po kliknięciu, najechaniu kursorem lub podczas przewijania.

dodaj animacje CSS do WordPress - animateon

Gdy będziesz zadowolony z ustawień, możesz kliknąć przycisk „ Anime To Aby zobaczyć podgląd animacji.

Następnie kliknij na przycisk wstawka aby dodać animację do swojego posta lub strony. Zauważysz, że wtyczka doda krótki kod z fikcyjną treścią w edytorze wizualnym.

animować-shortcode

Musisz usunąć fikcyjną zawartość wewnątrz skrótu i ​​zastąpić ją własną treścią, obrazami lub czymkolwiek innym, co chcesz animować.

Odkryj też Jak dodać interaktywne mapy do swojej witryny WordPress

content-shortcode

Wszystko, co musisz teraz zrobić, to opublikować swoje treści i wyświetlić ich podgląd.

Odkryj także niektóre wtyczki premium WordPress  

Możesz użyć innych WordPress wtyczki aby nadać nowoczesny wygląd i zoptymalizować obsługę Twojego bloga lub strony internetowej.

Oferujemy tutaj kilka premium wtyczek WordPress, które pomogą Ci to zrobić.

1. ChimpMate Pro

Szympans to WordPress Plugin Pop-up premium MailChimp, który pomoże Ci przekształcić czytelników w subskrybentów. Został zaprojektowany, aby powiększać twoją listę e-mail bez irytowania odwiedzających denerwującymi wyskakującymi okienkami.ChimpMate Pro

Jest w pełni konfigurowalny i opanujesz, kiedy i gdzie wyświetlać wyskakujące okienka. Inne jego funkcje to: wsparcie z kilku przeglądarek i ma pwiele opcji planowania, w pełni konfigurowalny układ, aresponsywne wsparcie klienta, tjidealna integracja z WooCommerce , excellente zarządzanie pamięcią podręczną, doskonała integracja z wieloma Motywy WordPress, wielojęzyczne wsparcie dzięki do wtyczki WPML, npjuż niewiele.

PobierzDemo | hosting

2. WooCommerce Cardstream Payment Gateway

CardStream jest jedynym niezależnym dostawcą bram płatniczych. Ten WordPress Plugin premium umożliwia przyjmowanie płatności bezpośrednio w sklepie internetowym WooCommerce za pośrednictwem Cardstream.

WooCommerce Cardstream Payment Gateway

Daje również możliwość akceptowania płatności za pomocą rozwiązania hostowanego przez Cardstream.

PobierzDemo | hosting

3. Źródło danych

Źródło danych to WordPress Plugin premium skupiający się na wizualnej prezentacji Twoich danych na dowolnej stronie Twojej witryny. Umożliwia prezentację danych z plików CSV, XML, Excel, arkuszy kalkulacyjnych Google, baz danych MySQL lub niestandardowych typów postów w postaci tabeli z możliwością sortowania i filtrowania, różnych wykresów, map i nie tylko.Wtyczki Wordpress w źródle danych wstawiają tabele graficzne w formie bloga witryny

Wśród jego funkcji znajdziesz między innymi: iintuicyjny interfejs, tw oparciu o model twoich danych, tsortowalne, filtrowalne i responsywne,transmisja z Mapy Google i wielojęzyczna, aresponsywna obsługa klienta, jeden minstrukcja obsługi, iszybka instalacja, et więcej

Pobierz Demo | hosting

Polecane zasoby

Dowiedz się o innych zalecanych zasobach, które pomogą Ci zbudować witrynę i zarządzać nią.

Wnioski

Tutaj! To wszystko w tym samouczku, mamy nadzieję, że pomógł Ci on nauczyć się integrować animacje CSS w WordPress. Nie wahaj się udostępnij znajomym w swoich ulubionych sieciach społecznościowych

Będziesz jednak mógł również skonsultować się z nami Zasoby, jeśli potrzebujesz więcej elementów do realizacji projektów tworzenia stron internetowych, zapoznaj się z naszym przewodnikiem na stronie Tworzenie bloga WordPress.

Jeśli masz sugestie lub uwagi, zostaw je w naszej sekcji commentaires.

...