Cum (și de ce) să adăugați derularea infinită pe site-urile web ale clienților

dec. 31, 2021
admin

Când proiectați site-uri WordPress pentru clienții dvs., ușurința de utilizare este un factor important de luat în considerare. Cu toate acestea, unele dintre tehnicile folosite pentru a îmbunătăți Experiența Utilizatorului (UX) pe un site, s-ar putea să nu fie cele mai bune metode pentru un alt site.

Desfășurarea infinită este o tactică pe care dezvoltatorii și designerii o folosesc pentru a menține vizitatorii site-ului implicați. În timp ce unii postulează că poate afecta de fapt capacitatea de utilizare a site-urilor, există multe cazuri în care poate fi benefică.

În această postare, vom explica ce este defilarea infinită și ce tipuri de site-uri pot beneficia de ea. Apoi vă vom prezenta trei metode pe care le puteți folosi pentru a adăuga această funcționalitate pe site-urile web ale clienților dumneavoastră. Să începem!

O introducere în derularea infinită

Derularea infinită este o tehnică de design web în care noul conținut este încărcat automat atunci când un vizitator ajunge în partea de jos a paginii. Rezultatul este o alimentare constantă și aparent nesfârșită de conținut.

Exemple populare de site-uri care utilizează defilarea infinită sunt rețelele sociale precum Facebook, Twitter și Pinterest. Îl puteți vedea, de asemenea, pe site-uri de blogging și de divertisment, cum ar fi Mashable și Buzzfeed:

Există multe beneficii ale încorporării derulării infinite pe aceste site-uri. Cel mai evident, economisește timp și oferă utilizatorilor dvs. mai mult conținut fără a fi nevoie să facă clic pe un buton Citește mai mult sau pe linkuri de paginare.

Cu mai puține distrageri, alimentarea automată a conținutului poate însemna, de asemenea, că utilizatorii rămân mai mult timp, ceea ce se poate traduce prin rate de implicare mai mari. În plus, această caracteristică este prietenoasă cu dispozitivele mobile.

Cu toate acestea, nu toate site-urile web sunt potrivite pentru derularea infinită. De exemplu, dacă aveți un site web orientat spre obiective, cum ar fi un magazin de comerț electronic, poate îngreuna sarcina utilizatorilor de a găsi ceea ce caută. De asemenea, poate avea un impact asupra performanței site-ului dacă nu este optimizat corect.

Pe de altă parte, dacă aveți un site cu o structură liniară, poate fi foarte benefic. Derularea infinită poate fi deosebit de utilă în scopuri de povestire, fie prin postări de blog de lungă durată, fie prin conținut vizual, cum ar fi imaginile.

Cum să adăugați derulare infinită la site-urile web ale clienților (3 metode)

Dacă creați site-uri web ale clienților care sunt axate pe conținut, ați putea lua în considerare adăugarea unei funcții de derulare infinită. Să aruncăm o privire la trei metode pe care le puteți folosi pentru a face acest lucru.

Utilizați un plugin de derulare infinită

Una dintre cele mai rapide și mai simple metode pe care le puteți folosi pentru a adăuga derulare infinită pe site-urile web ale clienților dumneavoastră este să folosiți un plugin. Unele, cum ar fi Jetpack, includ caracteristici pentru implementarea acestui element de design.

Nu există prea multe pluginuri de defilare infinită de sine stătătoare. Cu toate acestea, unul popular pe care vă recomandăm să îl folosiți este Ajax Load More:

Acest plugin este gratuit și ușor de utilizat, deși necesită anumite cunoștințe de programare. Acesta vă permite să adăugați defilare infinită pentru încărcarea leneșă a postărilor, paginilor și comentariilor.

După ce instalați și activați pluginul, puteți configura parametrii de interogare WordPress relevanți pe baza diferitelor tipuri de conținut. Pe pagina Settings (Setări), puteți ajusta și personaliza modul în care se comportă Ajax Load More pe site-urile web ale clienților dvs. De exemplu, puteți adăuga propriul CSS personalizat:

Plinul include, de asemenea, un Shortcode Builder pe care îl puteți utiliza pentru a modifica rapid paginile și postările din editorul de conținut sau din fișierele șablon. O altă caracteristică a pluginului care merită verificată este Repeater Templates:

Vă puteți face propriul șablon de repetare și puteți ajusta modul în care funcționează HTML și PHP în cadrul shortcode-ului. De asemenea, puteți include mai multe instanțe ale pluginului Ajax Load More într-o singură postare, pagină sau șablon.

În timp ce pluginul gratuit oferă o mulțime de caracteristici pentru derulare infinită, există și o versiune premium care deblochează accesul la mai multe șabloane. Pentru a afla mai multe, puteți consulta documentația și pagina de asistență Ajax Load More.

Alegeți teme cu derulare infinită încorporată

Dacă nu doriți să adăugați un alt plugin pe site-urile clienților dumneavoastră, nu vă faceți griji. Puteți obține același efect folosind o temă care are scroll infinit încorporat.

Desigur, această cale nu este cea mai practică pentru site-urile existente. Schimbarea temei unui site necesită adesea un rebranding extins. Acest lucru nu merită exact deranjul doar pentru a avea acces la o funcție de derulare infinită – mai ales având în vedere că o puteți obține prin alte metode.

Există un număr sănătos de teme WordPress care includ această funcționalitate. Puteți naviga în directorul de teme WordPress și căuta după caracteristica de derulare infinită:

În timp ce tema în sine poate fi gratuită, rețineți că ar putea fi necesar să faceți upgrade la versiunea premium pentru a utiliza derularea infinită. Cu toate acestea, există unele care oferă funcționalitatea fără niciun cost, cum ar fi Minimal Dark.

După ce găsiți o temă care vă place și care include această funcție, descărcați-o și instalați-o așa cum ați face cu orice altă temă. Cele mai multe vor include caracteristica în Theme Customizer.

De exemplu, cu Minimal Dark, puteți găsi opțiunea de defilare infinită mergând la Appearance > Customize > Theme Options > Pagination Options:

Dacă doriți caracteristici mai avansate, ați putea lua în considerare o temă premium. Theme Forest are o selecție largă care include defilare infinită.

Direcțiile pentru activarea și utilizarea funcției de defilare infinită vor depinde de tema pe care o utilizați. Prin urmare, cel mai bine este să verificați documentația dezvoltatorului pentru îndrumare.

Adaugați manual codul la site-ul dvs. Această opțiune vă oferă mai mult control și elimină necesitatea de a instala un plugin suplimentar.

În plus, puteți utiliza acest cod pe site-uri cu teme care nu vin cu derulare infinită încorporată. Primul pas este să activați caracteristica prin intermediul fișierului functions.php al temei dumneavoastră.

Pentru a face acest lucru, adăugați următorul cod în fișier:

După ce acest lucru este complet, următorul pas este să configurați funcția Render Parameter. Aceasta este partea de cod care se ocupă de încărcarea posturilor pentru derularea infinită într-o buclă.

Pentru a face în așa fel încât posturile să fie încărcate continuu, adăugați funcția mytheme_infite_scroll_init la fișierul functions.php al temei dvs. astfel:

function mytheme_infinite_scroll_render(){get_template_part( 'loop' );}

După ce adăugați aceste două fragmente, ar trebui să puteți începe. Cu toate acestea, dacă nu funcționează, este posibil să mai trebuiască să schimbați tema site-ului. Este posibil ca produsele mai vechi și depășite să nu suporte deloc derularea infinită.

Concluzie

Derularea infinită nu este pentru toată lumea. Cu toate acestea, există unele site-uri web, cum ar fi blogurile și alte publicații online cu conținut intensiv, unde poate oferi un UX mai bun și chiar poate crește gradul de implicare.

În acest articol, am discutat trei metode pe care le puteți folosi pentru a adăuga derularea infinită pe site-urile web ale clienților dvs.

Lasă un răspuns

Adresa ta de email nu va fi publicată.