Ați văzut aceste frumoase animații CSS pe site-uri populare? Efecte de animație, cum ar fi conținutul care alunecă, care disipează, imaginile sale care revin, etc. ? De asemenea, doriți să adăugați animații CSS la WordPress?

În acest articol, vă vom arăta cum să adăugați cu ușurință animații CSS la WordPress fără a scrie niciun cod.

Când și de ce ar trebui să utilizați animații CSS?

Animațiile CSS vă permit să atrageți atenția utilizatorului asupra diferitelor părți ale paginii. Le puteți utiliza pentru a anima caracteristicile produsului sau un buton de îndemn. Multe site-uri web folosesc animații CSS atunci când utilizatorul derulează pagina în jos. Acesta adaugă o anumită personalitate paginii și accentuează cele mai importante elemente.

Animațiile CSS sunt, de asemenea, mai rapide decât utilizarea flash-ului sau a videoclipurilor. Se încarcă rapid și sunt acceptate de majoritatea browserelor web moderne. Puteți adăuga animații CSS manual la tema WordPress sau la foaia de stil. tema copil. Cu toate acestea, majoritatea începătorilor nu doresc să își editeze fișierele tematice sau să învețe CSS.

Acestea fiind spuse, în acest tutorial, vom vedea cum puteți adăuga cu ușurință animații CSS pe site-ul dvs. WordPress.

Dar înainte, dacă nu ați instalat niciodată WordPress, descoperiți Cum se instalează un blog WordPress pași 7 et Cum de a găsi, a instala și a activa o temă WordPress pe blog-ul dvs. 

Apoi înapoi la motivul pentru care suntem aici.

Cum se configurează animațiile CSS

Vom folosi un plugin pentru acest tutorial. Vă permite să creați animații CSS folosind Editor vizual WYSIWYG. Primul lucru pe care trebuie să-l faceți este să instalați și să activați pluginul Animați-l!. Pluginul funcționează fără configurare și nu există panou de control.

Descopera Cum se instalează un plug-in WordPress dacă nu ai făcut-o niciodată.

Creați o postare nouă și veți vedea un nou buton pe bara de instrumente a editorului vizual.

Făcând clic pe buton, veți vedea o nouă fereastră în care vă puteți proiecta animațiile CSS. Pluginul acceptă multe animații CSS, dintre care toate sunt alese.

Mai întâi trebuie să selectați stilul de animație. După aceea, trebuie să alegeți timpul de așteptare înainte de animație și durata animației. În cele din urmă, puteți specifica când va începe animația.

De asemenea, mergeți mai departe descoperind Cum de a adăuga animații impresionante în blogul dvs.

Pluginul oferă trei opțiuni. Puteți rula animația făcând clic, pe cursor sau în timp ce derulați.

Odată ce sunteți mulțumit de setări, puteți face clic pe butonul " Anime-l Pentru a vedea previzualizarea animației.

Apoi faceți clic pe butonul Insera pentru a adăuga animație la postare sau pagină. Veți observa că pluginul va adăuga un shortcode cu conținut fals pe editorul vizual.

Trebuie să eliminați conținutul fals din interiorul codului scurt și să îl înlocuiți cu propriul dvs. conținut, imagini sau orice altceva doriți să animați.

Descoperă și tu Cum să adăugați hărți interactive pe site-ul dvs. WordPress

Tot ce trebuie să faceți acum este să vă publicați conținutul și să îl previzualizați.

Descoperiți și câteva plugin-uri premium WordPress  

Puteți folosi altele WordPress plugin-uri pentru a oferi un aspect modern și pentru a optimiza gestionarea blogului sau site-ului dvs.

Vă oferim aici câteva plugin-uri WordPress premium care vă vor ajuta să faceți asta.

1. ChimpMate Pro

Cimpanzeul este WordPress plug-in Pop-up premium MailChimp, care vă va ajuta să vă convertiți cititorii în abonați. A fost conceput pentru a vă crește lista de e-mail fără a-i irita pe vizitatori cu ferestre pop-up enervante.

Este complet personalizabil și veți stăpâni când și unde să afișați ferestrele pop-up. Celelalte caracteristici ale acestuia sunt: ​​suport a mai multor browsere și are pmai multe opțiuni de planificare, un aspect complet personalizabil, asuport pentru clienți receptiv, iintegrare perfectă cu WooCommerce, un ex excelent managementul cache-ului, integrare perfectă cu multe Teme WordPress, suport multilingv datorită la pluginul WPML, de exnu mai mult.

Descarca | Demo | web hosting

2. WooCommerce Cardstream Payment Gateway

CardStream este singurul furnizor independent de gateway de plată. Acest WordPress plug-in premium vă permite să acceptați plăți direct în magazinul dvs. online WooCommerce prin Cardstream.

De asemenea, vă oferă posibilitatea de a accepta plăți folosind soluția găzduită Cardstream.

Descarca | Demo | web hosting

3. Sursa de date

DataSource este o WordPress plug-in premium axat pe prezentarea vizuală a datelor dvs. în orice pagină a site-ului dvs. web. Vă permite să prezentați date din fișiere CSV, XML, Excel, foi de calcul Google, baze de date MySQL sau tipuri de postări personalizate ca tabel sortabil și filtrabil, diferite grafice, hărți și multe altele.

Printre caracteristicile sale, veți găsi printre altele: un iinterfață intuitivă, tcapacități bazate pe modelul datelor dvs., tcapacitate de filtrare, capacitate de filtrare și reactivitate,inport de Hărți Google și mai multe limbi, aasistență clienți receptivi, un mmanual de utilizare, un iinstalare rapidă,Mai mult

Descarca | Demo | web hosting

Resurse recomandate

Aflați despre alte resurse recomandate pentru a vă ajuta să construiți și să gestionați site-ul dvs. web.

• Cum de a comprima și redimensiona imagini pe WordPress
• Cum de a adăuga un widget la antetul de blog-ul dvs. WordPress
• Cum să adăugați hărți interactive pe site-ul dvs. WordPress
• Cum să remediați eroarea 413 pe WordPress

Concluzie

Aici ! Gata pentru acest tutorial, sperăm că te-a ajutat să înveți cum să integrezi animații CSS în WordPress. Nu ezita sa împărtășiți cu prietenii de pe rețelele de socializare preferate. 

Cu toate acestea, veți putea, de asemenea, să ne consultați Resurse, dacă aveți nevoie de mai multe elemente pentru a vă derula proiectele de creare a site-urilor de internet, consultați ghidul nostru cu privire la Creare blog WordPress.

Dacă aveți sugestii sau observații, lăsați-le în secțiunea noastră comentarii.

...