Cum să creați o căutare cu completare automată în timp real în WordPress

Când vizitatorii nu găsesc ceea ce caută, nu rămân – dau click și pleacă, adesea pentru totdeauna.

Căutarea implicită WordPress nu o face ușoară. Este lentă, greoaie și depășită: tastați un cuvânt cheie, apăsați Enter, așteptați reîncărcarea completă a paginii... doar pentru a obține rezultate care s-ar putea să nu fie nici măcar relevante.

Acum imaginează-ți opusul… rezultate ale căutării care apar instantaneu, în momentul în care un vizitator începe să tasteze. Aceasta este magia căutării live cu completare automată (cunoscută și sub denumirea de căutare Ajax). Se simte modernă, fără efort și menține oamenii implicați pe site-ul tău.

În acest ghid, veți învăța cum să adăugați căutare live cu completare automată în WordPress, astfel încât să puteți oferi rezultate fulgerătoare, să îmbunătățiți experiența utilizatorului și să păstrați vizitatorii navigând mai mult timp. 🧑‍💻

De ce să adaugi căutare automată live în WordPress?

Căutarea live cu completare automată îi ajută pe vizitatori să găsească mai rapid ceea ce caută pe site-ul tău, fără a reîncărca pagina. Pe măsură ce utilizatorii tastează în bara de căutare, rezultatele apar instantaneu într-un meniu derulant, astfel încât aceștia pot da clic și accesa direct conținutul de care au nevoie.

Acest tip de experiență rapidă și utilă menține oamenii pe site-ul dvs. WordPress mai mult timp și reduce frustrarea.

De fapt, cercetările arată că 40% dintre utilizatori vor părăsi un site web dacă experiența de căutare este slabă sau arată rezultate irelevante. Cu căutarea cu completare automată, vizitatorii nu trebuie să ghicească cuvântul cheie corect, să aștepte o pagină de rezultate lentă sau să ajungă la un punct mort.

Din păcate, căutarea WordPress este destul de limitată implicit. Nu caută întotdeauna în detalii de produse sau tipuri de postări personalizate și se chinuie cu potrivirile exacte.

Uneori, chiar afișează o pagină „nu s-au găsit rezultate”, chiar și atunci când conținutul există.

Aici poate fi de mare ajutor căutarea live. Este deosebit de utilă pentru bloguri, site-uri de știri și magazine online, unde vizitatorii doresc să găsească ceva specific, rapid.

Dacă doriți să facilitați descoperirea celor mai bune conținuturi de către oameni, adăugarea unei căutări live este o modalitate simplă și eficientă de a face acest lucru.

Cum să adăugați căutare live cu completare automată în WordPress

Cel mai simplu mod de a adăuga căutare live cu completare automată (Ajax) pe site-ul tău este utilizând un plugin. În acest tutorial, voi folosi pluginul gratuit SearchWP Live Ajax Search, care este unul dintre cele mai bune pluginuri de căutare WordPress.

Funcționează imediat, prin actualizarea automată a oricăror formulare de căutare *existente* de pe site-ul dvs., cum ar fi cel din antetul sau bara laterală a temei. Acest lucru înseamnă că puteți obține sugestii de căutare live instantaneu, fără a fi nevoie să scrieți cod sau să modificați setări.

Acum, vă voi ghida prin modul de creare a unei căutări live cu completare automată în WordPress.

Iată o prezentare generală rapidă a tuturor lucrurilor pe care le voi acoperi:

Să începem!

Pasul 1: Instalează și activează SearchWP Live Ajax Search

Mai întâi, trebuie să instalezi și să activezi pluginul SearchWP Live Ajax Search.

Puteți găsi acest plugin direct în tabloul de bord WordPress accesând Plugins » Add Plugin.

Pe ecranul următor, căutați „SearchWP Live Ajax Search”.

Odată ce găsiți pluginul în rezultatele căutării, faceți clic pe butonul „Instalați acum”. După finalizarea instalării, faceți clic pe „Activați” pentru a activa pluginul pe site-ul dvs.

Pentru instrucțiuni detaliate de instalare, vezi ghidul nostru pas cu pas despre cum să instalezi un plugin WordPress.

Pluginul este complet gratuit și dezvoltat de aceeași echipă din spatele pluginului premium SearchWP. Funcționează independent, deci nu trebuie să achiziționați nimic pentru a începe cu funcționalitatea de căutare live.

După activare, un nou element de meniu ‘SearchWP’ va apărea în zona de administrare WordPress. Vei folosi acest lucru pentru a configura setările în pasul următor.

Pasul 2: Configurați setările de bază pentru căutare

Acum că pluginul este instalat, trebuie să activați funcționalitatea de căutare live.

Accesează SearchWP » Setări în tabloul de bord WordPress.

Pe pagina de setări, veți vedea opțiunile de configurare. Asigurați-vă că sunteți în fila „Live Search” și căutați comutatorul „Enable Live Search” în partea de sus a paginii.

Pur și simplu faceți clic pe comutator pentru a-l activa, apoi asigurați-vă că faceți clic pe butonul „Salvare” pentru a vă stoca setările.

Odată activată, căutarea live Ajax va începe automat să funcționeze cu formularele de căutare existente pe site-ul dvs. WordPress.

Pluginul folosește setări implicite inteligente care funcționează bine pentru diferite tipuri de site-uri web imediat după instalare. Implicit, pluginul este configurat să interogheze Titlurile Postărilor, Titlurile Paginilor și Conținutul pentru a oferi sugestii relevante.

Pasul 3: Adaugă bara de căutare live pe site-ul tău (Opțional)

Pluginul SearchWP Live Ajax Search activează automat căutarea live pe orice formulare de căutare *existente* din tema WordPress.

Cu toate acestea, s-ar putea să dorești să adaugi o bară de căutare într-o locație nouă, cum ar fi bara laterală, subsolul sau o pagină de destinație personalizată. Acest pas îți va arăta cum să faci acest lucru.

Adăugați Căutare Live cu Completare Automată în Zone Pregătite pentru Widget-uri

Pentru a adăuga o casetă de căutare în zonele de widget-uri, cum ar fi bara laterală sau subsolul, trebuie să accesezi Aspect » Widget-uri în tabloul de bord de administrare WordPress.

Apasă pe butonul „+” din zona widget-ului, cum ar fi bara laterală sau subsol, apoi caută widget-ul standard „Căutare”.

SearchWP este conceput pentru a detecta automat acest widget implicit și a-l îmbunătăți cu funcționalități de completare automată live. Prin urmare, nu trebuie să cauți un bloc specific „SearchWP”.

Odată adăugat, poți personaliza textul placeholder.

De exemplu, dacă ai un site de știri, ai putea personaliza titlul widgetului cu ceva de genul „Caută cele mai recente povești” sau „Găsește articole de știri”.

Sau puteți lăsa pur și simplu „Căutare”.

Nu uitați să faceți clic pe butonul ‘Actualizare’ pentru a salva modificările. Câmpul de căutare live va apărea acum în zona dvs. de widgeturi.

Iată cum arată pe site-ul meu demo:

Adaugă căutare automată live folosind editorul complet al site-ului (FSE)

Dacă folosești o temă bazată pe blocuri care suportă Editorul Complet al Site-ului, atunci poți adăuga casete de căutare în diferite părți ale site-ului tău, cum ar fi antetul, bara laterală și multe altele.

Mai întâi, accesează Aspect » Editor din tabloul de bord WordPress.

Aceasta va lansa Editorul Complet al Site-ului.

De aici, dă clic pe „Șabloane” sau poți merge la Modele » Antet – în funcție de tema bazată pe blocuri activă.

Apoi, poți selecta șablonul pe care dorești să-l editezi, cum ar fi Antetul sau un șablon de Pagină.

Opțiunile exacte vor depinde de tema ta, dar recomand selectarea părții de șablon „Antet”. Acest lucru asigură că bara de căutare va apărea pe fiecare pagină a site-ului tău web.

Odată ce faceți clic pe șablon, veți vedea un editor vizual cu blocuri.

Continuă și apasă pe butonul „+” pentru a adăuga un bloc nou, apoi caută „Căutare” în inserătorul de blocuri. Poți apoi muta blocul Căutare în sus și în jos la locația dorită în cadrul șablonului.

De aici, puteți personaliza aspectul blocului de căutare folosind panoul de setări al blocului.

De exemplu, poți ajusta textul placeholder.

Dacă aveți un blog WordPress, atunci ați putea dori să folosiți ceva de genul „Căutați pe blog” sau „Găsiți articole utile”. Sau puteți, de asemenea, să-l lăsați pur și simplu ca „Căutați”.

Puteți, de asemenea, să personalizați stilul barei de căutare și opțiunile de aspect pentru a se potrivi cu designul site-ului dvs.

Odată ce sunteți mulțumit de cum arată, faceți clic pe butonul ‘Actualizare’ pentru a salva modificările.

Pasul 4: Testează și depanează căutarea ta live

Acum este momentul să testezi noua funcție de căutare live pentru a te asigura că funcționează corect.

Recomand să deschideți site-ul web într-o fereastră incognito și să tastați câteva caractere în caseta de căutare. Dacă totul funcționează, veți vedea rezultatele apărând instantaneu într-un meniu derulant. Aceasta înseamnă că Ajax funcționează corect.

Este o idee bună să testați căutarea live pe diferite dispozitive, cum ar fi telefoane și tablete, pentru a vă asigura că este prietenoasă cu dispozitivele mobile. Verificați dacă tastatura de pe ecran nu ascunde meniul derulant cu rezultatele căutării atunci când un utilizator tastează.

De asemenea, puteți încerca în mai multe browsere, cum ar fi Chrome, Firefox și Safari, pentru a vă asigura că rezultatele live apar în mod constant.

Dacă căutarea live nu apare sau nu funcționează conform așteptărilor, atunci cei mai comuni vinovați sunt problemele de caching și conflictele de pluginuri.

Pluginurile de caching stochează copii statice ale paginilor dvs. pentru a accelera încărcarea. Cu toate acestea, acest lucru poate împiedica uneori rularea scripturilor de căutare „live”, ceea ce înseamnă că rezultatele nu vor apărea instantaneu.

Un plugin bun pentru acest lucru este WP Rocket. Este ușor de utilizat pentru începători și vă permite să ștergeți cache-ul, să optimizați scripturile și să controlați modul în care sunt încărcate fișierele pentru o performanță mai bună.

Pentru detalii, puteți consulta ghidul nostru despre cum să ștergeți cache-ul WordPress.

Dacă acest lucru nu rezolvă problema, încercați să dezactivați alte pluginuri unul câte unul pentru a verifica conflictele. Acest lucru vă poate ajuta să identificați dacă un alt plugin interferează cu căutarea dvs. live.

Pentru mai multe sfaturi de depanare, vă rugăm să consultați ghidul nostru despre cum să remediați căutarea WordPress care nu funcționează.

Sfat bonus: Actualizați pentru o căutare și mai inteligentă (potrivire fuzzy)

Noua ta căutare live oferă o experiență mult mai bună utilizatorilor tăi. Dar ce se întâmplă dacă cineva face o greșeală de scriere? În mod implicit, WordPress ar putea returna niciun rezultat pentru „wordpres” în loc de „wordpress”.

Aici intervine căutarea fuzzy, și este o funcție puternică disponibilă în pluginul premium SearchWP.

Căutarea fuzzy ajută site-ul tău să înțeleagă ce încearcă utilizatorii tăi să găsească, chiar dacă greșesc ortografia sau folosesc cuvinte parțiale.

De exemplu, dacă cineva caută „mobilier vntage”, un site cu căutare fuzzy îi va afișa totuși rezultate relevante pentru „mobilier vintage”.

Acest lucru împiedică utilizatorii să ajungă la un punct mort fără rezultate și îi ajută să găsească conținut, îmbunătățind experiența utilizatorului și menținându-i pe site-ul dvs.

Pentru instrucțiuni pas cu pas, puteți consulta ghidul nostru despre cum să adăugați căutare fuzzy în WordPress.

Întrebări frecvente despre adăugarea căutării live cu completare automată în WordPress

Primesc multe întrebări de la cititorii noștri despre funcționalitatea de căutare WordPress, așa că am adunat răspunsuri la cele mai frecvente dintre ele.

Care este cel mai bun plugin de căutare pentru WordPress?

Pentru funcționalitatea de căutare live, recomand SearchWP Live Ajax Search, deoarece este gratuit și funcționează excelent imediat.

Dacă aveți nevoie de funcții mai avansate, cum ar fi căutarea în câmpuri personalizate sau analize detaliate, atunci pluginul premium SearchWP este excelent.

Cum pot adăuga completare automată la câmpurile de adresă în WordPress?

Autocompletarea adreselor este diferită de căutarea de conținut. Aceasta folosește servicii precum Google Places API pentru a sugera adrese reale pe măsură ce utilizatorii tastează.

Veți avea nevoie de un plugin de formulare precum WPForms sau Gravity Forms care include funcții de completare automată a adresei. Acesta se conectează la serviciile de cartografiere pentru a oferi sugestii de adrese stradale, ceea ce este separat de căutarea conținutului site-ului dvs.

Pot crea un formular care permite utilizatorilor să caute într-o anumită categorie?

Dacă doriți să adăugați un meniu derulant, astfel încât utilizatorii să poată căuta după categorie, atunci veți avea nevoie de pluginul SearchWP Pro.

Pluginul gratuit SearchWP Live Ajax Search (cel pe care îl acoperim în acest ghid) va afișa numele categoriilor în rezultatele live, dar nu vă permite să creați un formular de căutare complet cu filtre de categorii.

Pentru a obține acea funcție, va trebui să faceți upgrade la pluginul complet SearchWP și să urmați tutorialul nostru despre cum să căutați după categorie în WordPress.

Cum adaug o funcție de căutare pe site-ul meu WordPress?

Majoritatea temelor WordPress includ un widget de căutare încorporat pe care îl puteți adăuga în meniul, bara laterală, antetul sau subsolul dvs.

Pentru detalii, consultați ghidul nostru despre cum să adăugați o bară de căutare în meniul dvs. WordPress.

Mai multe ghiduri pentru a îmbunătăți căutarea WordPress

Sperăm că acest ghid v-a ajutat să adăugați căutare live cu completare automată pe site-ul dvs. WordPress. De asemenea, este posibil să doriți să consultați celelalte ghiduri noastre conexe pentru a îmbunătăți căutarea pe site-ul dvs.:

• Cum să căutați după categorie în WordPress
• Cum să adăugați indexarea și căutarea PDF în WordPress
• Cum să faceți comentariile blogului dvs. căutabile în WordPress
• Cum să adăugați căutarea WordPress pe pagina de arhive a blogului
• Cum să vedeți analizele de căutare în WordPress (moduri ușoare)

Dacă v-a plăcut acest articol, atunci vă rugăm să vă abonați la Canalul nostru de YouTube pentru tutoriale video despre WordPress. Ne puteți găsi, de asemenea, pe Twitter și Facebook.