Cum să adăugați bara de căutare pe un site WordPress
Publicat: 2021-10-29Bara de căutare este un element esențial al unui site web cu care nimeni nu ar fi de acord. Acest lucru se datorează faptului că un site web conține o mulțime de informații prin pagina de pornire, pagini de produse, pagini de blog, pagina de prețuri etc. De aceea este esențial să adăugați bara de căutare la site-ul dvs. WordPress.
Dacă aveți nevoie de câteva informații existente pe diferite pagini, cum le veți găsi? Îi vei găsi vizitând acele pagini individual? Cu siguranță, nu ți-ar plăcea să faci asta. Nu că nu veți găsi informațiile solicitate în acest fel. Dar este, de asemenea, consumator de timp și de rău. Aici va intra în joc adăugarea unei bare de căutare pe site-ul dvs.
De ce să adăugați o bară de căutare pe site-ul dvs.?
Să presupunem că nu aveți o bară de căutare pe site-ul dvs. În acest caz, atunci când vizitatorii vă vor vizita site-ul, se vor strădui să găsească informațiile necesare. Drept urmare, ei vor părăsi site-ul dvs. și întregul dvs. scop de a le introduce pe site va merge în zadar.
Permiteți-mi să vă prezint mai jos câteva dintre beneficiile majore pe care le puteți obține adăugând o bară de căutare pe site-ul dvs. -
- Ușurează efortul clienților dvs. de a găsi informații
- Eficientizează experiența utilizatorului
- Îmbunătățește implicarea
- Reduce rata de respingere
- Afișează elementele sau informațiile necesare cu câteva cuvinte cheie reducând efortul
Adăugarea unei bare de căutare în meniu cu widgetul de căutare implicit WordPress:
Puteți adăuga bara de căutare în meniu cu widget-ul de căutare implicit WordPress? Nu, nu poți. Deoarece WordPress vă permite să adăugați bara de căutare numai în zonele pregătite pentru widget-uri.
Dacă doriți să adăugați bara de căutare în meniu, trebuie să utilizați alte plugin-uri sau widget-uri în diferite zone ale site-ului dvs., inclusiv antet și subsol.
De aceea, v-aș ghida prin 3 metode diferite de a adăuga o bară de căutare pe site-ul dvs. WordPress în acest tutorial.
Acum, să aruncăm o privire la modul în care puteți adăuga bara de căutare pe site-ul dvs. prin intermediul widget-ului implicit WordPress.
Adăugați bara de căutare cu widgetul de căutare implicit WordPress:
Cel mai simplu și mai convenabil mod de a injecta o bară de căutare pe site-ul dvs. este prin intermediul tabloului de bord WordPress. Cum să faci asta? Hai să verificăm-
Navigați la Widgeturi din tabloul de bord:
La început, accesați tabloul de bord al panoului de administrare și găsiți Aspect. Navigați și faceți clic pe Widgeturi dintr-o listă de elemente sub Aspect.
Tabloul de bord > Aspect > Widgeturi

Adăugați widgetul de căutare din widgeturile disponibile:
Aceasta vă va duce la o pagină nouă care apare cu diferite secțiuni de pagină. Acum, apăsați butonul „Adăugați bloc” (Apare cu semnul +) pentru a vedea toate widget-urile existente.
Derulați în jos pentru a găsi widgetul de căutare sau puteți scrie „Căutare” în câmpul de căutare pentru a găsi widgetul de căutare.
Faceți clic pe secțiunea în care doriți să apară bara de căutare și apoi apăsați pe widgetul de căutare. Alternativ, puteți, de asemenea, să glisați și să plasați widgetul de căutare în secțiunea dorită.

Faceți modificările necesare:
Bara de căutare va apărea acum sub secțiunea selectată. Puteți face modificările necesare diferitelor elemente, cum ar fi alinierea barei de căutare, poziția butonului, culoarea textului și așa mai departe.
De asemenea, puteți adăuga o etichetă personalizată în bara de căutare, conform cerințelor dvs. În cele din urmă, faceți clic pe butonul Actualizare.

Vizualizați bara de căutare din pagina dvs.:
Acum, dacă vizitați oricare dintre paginile sau postările dvs. publicate, puteți observa că bara de căutare sau caseta de căutare apar pe bara laterală principală.

Adăugați bara de căutare cu widgetul de căutare ElementsKit:
Acum, vă voi ghida printr-un alt mod ușor de a adăuga o bară de căutare în site-ul dvs. WordPress. Și asta prin widgetul Căutare antet al ElementsKit. Este foarte simplu să adăugați o casetă de căutare prin ElementsKit.
Fără alte prelungiri, hai să verificăm...
Navigați la oricare dintre postările sau paginile existente din tabloul de bord:
În primul rând, accesați tabloul de bord și găsiți postări sau pagini. Aici, voi arăta cum funcționează widgetul ElementsKit cu o postare numită „Hello World!”

Accesați „Postări” și apoi selectați „Toate postările” pentru a vă permite să apară toate postările. De acolo, puteți alege postarea în care doriți să adăugați o bară de căutare. În cazul în care nu aveți nicio postare sau pagină existentă, trebuie să adăugați o nouă postare sau pagină.
Tabloul de bord > Postările > Toate postările > Postarea dvs

Comutați la fereastra Elementor:
Acum, faceți clic pe „Editați cu Elementor” situat în partea de sus-mijloc. Aceasta vă va duce la fereastra Elementor.

Trageți și plasați widgetul de căutare antet:
În fereastra Elementor, veți avea acces la o mulțime de widget-uri. Introduceți widgetul „Căutare antet” în câmpul de căutare pentru a găsi widgetul. Alternativ, puteți derula în jos și puteți găsi și widgetul.
Odată ce urmăriți widgetul, trageți-l și plasați-l în zona desemnată pentru a permite să apară bara de căutare. Nu uitați să adăugați secțiunea deasupra textului postării dvs., deoarece este o bară de căutare pentru antet.

Setați parametrii barei de căutare:
Odată ce bara de căutare apare pe pagină, este timpul să setați parametrii barei conform preferințelor dvs. Sub fila Conținut, veți avea o secțiune Căutare antet în care puneți un text substituent, selectați o pictogramă de căutare și ajustați dimensiunea fontului.

Sub fila Stil, veți avea 2 secțiuni - Căutare antet și Container de căutare. Din secțiunea Căutare antet, puteți ajusta parametrii precum culoarea de fundal, tipul de chenar, umbra casetei de căutare, marginea etc. ai barei de căutare.

Din secțiunea Căutare container, puteți selecta tipul de fundal și puteți seta textul substituentului și culoarea chenarului.

În sfârșit, ești gata de plecare!
După ce ați finalizat setările, sunteți pregătit să verificați și să vizualizați bara de căutare din partea frontală a postării dvs. Dacă nu sunteți mulțumit de aspectul casetei de căutare, puteți să îl modificați din nou din panoul de administrare.

ElementsKit este un supliment all-in-one pentru generatorul de pagini Elementor, care include module puternice, widget-uri, megameniu și antet și subsol.
Adăugați caseta de căutare cu codul CSS:
Mai există o modalitate pe care o puteți folosi pentru a adăuga o bară de căutare pe site-ul dvs. și aceasta este utilizarea codului CSS. Deși aveți nevoie de puține cunoștințe tehnice pentru a face asta, nu este știință rachetă. Vă voi arăta procesul aici și va fi foarte ușor după aceea.
Accesați Editorul de teme:
În primul rând, faceți clic pe „Aspect” din tabloul de bord și navigați la „Editor de teme”.

Deschideți fișierul header.php sau sidebar.php:
Cu aceasta, veți trece la fișierul style.css în mod implicit. De acolo, deschideți fișierul header.php sau sidebar.php , în funcție de poziția în care doriți să apară bara de căutare.

Adăugați funcția de bară de căutare:
Acum, adăugați această funcție <?php get_search_form(); ?> în codul fișierului header.php sau sidebar.php. Am adăugat funcția în codul fișierului header.php.

Vizualizați bara de căutare de pe site-ul dvs.:
În cele din urmă, deschideți oricare dintre paginile dvs. publicate și veți observa bara de căutare care apare în partea de sus. Dacă ați adăugat funcția în fișierul sidebar.php, bara de căutare va apărea pe bara laterală.

Lichidare:
Asta este!!! V-am prezentat 3 tehnici super ușoare de adăugare a unei bare de căutare pe site-ul dvs. WordPress. În funcție de cerințele tale, poți opta pentru oricare dintre ele. Cu toate acestea, dacă adăugați bara de căutare cu widgetul de căutare antet al ElementsKit, veți obține un avantaj suplimentar.
Ce e aia? Opțiuni de personalizare fără fund!!! Prin urmare, dacă vă place personalizarea, utilizați widgetul de căutare antet al ElementsKit. Cu asta, puteți oferi barei de căutare un aspect fascinant.
Doriți să aflați mai multe despre cea mai recentă actualizare a ElementsKit? Consultați blogul nostru pe cea mai recentă actualizare pe ElementsKit.
