Come aggiungere la barra di ricerca a un sito WordPress

Come aggiungere una barra di ricerca nel banner del sito WordPress

I proprietari di siti Web spesso hanno difficoltà ad aggiungere la barra di ricerca ai propri siti Web WordPress. Alcuni di loro adottano metodi complessi per aggiungere una barra di ricerca ai loro siti Web WP, mentre altri rimangono del tutto all'oscuro di quale metodo adottare.

Ciò che è fondamentale in questo caso è trovare un modo per aggiungere una barra di ricerca al tuo sito Web WordPress in modo fluido e senza sforzo. Se sei stufo di provare modi inefficienti per inserire una barra di ricerca nel tuo sito Web WordPress, sei arrivato nel pezzo giusto.

Non importa se hai appena creato un sito Web WP o hai un vecchio sito Web WP, troverai questo post informativo e istruttivo.

Barra di ricerca: un modo rapido ed efficiente per ottenere informazioni:

Un sito Web contiene tantissime informazioni attraverso la home page, le pagine dei prodotti, le pagine del blog e la pagina dei prezzi. Considerati semplicemente un visitatore del sito web. Quando visiti un sito web, molte volte tendi a reperire dati da pagine web diverse.

In tal caso, come troverai questi dati? Li troverai visitando quelle pagine individualmente? Sicuramente non ti piacerebbe farlo.

Non che non troverai le informazioni richieste in questo modo. Ma è anche una cosa dispendiosa in termini di tempo e disgustosa. È qui che entrerà in gioco l’aggiunta di una barra di ricerca al tuo sito WordPress. 

Secondo un sondaggio di Giornale dei motori di ricerca, Più di 40% i visitatori dicono che una casella di ricerca è la caratteristica più importante di un sito web

Perché aggiungere una barra di ricerca al tuo sito?

Supponiamo che tu non abbia una barra di ricerca sul tuo sito. In tal caso, quando i visitatori visiteranno il tuo sito, faranno fatica a trovare le informazioni richieste. Di conseguenza, lasceranno il tuo sito e il tuo intero scopo di inserirli nel sito web sarà vano.

Lasciami presentare alcuni dei principali vantaggi puoi migliorare aggiungendo una barra di ricerca al tuo sito qui sotto-

  • Facilita lo sforzo dei tuoi clienti per trovare informazioni
  • Semplifica l'esperienza dell'utente
  • Aumenta il coinvolgimento 
  • Riduce la frequenza di rimbalzo
  • Visualizza gli elementi o le informazioni necessari con alcune parole chiave

Puoi Aggiungi la barra di ricerca nel menu del sito web con il widget di ricerca predefinito di WordPress: 

È possibile aggiungere una barra di ricerca del menu con il widget di ricerca predefinito di WordPress? No, non puoi. Perché WordPress ti consente di aggiungere una barra di ricerca solo nelle aree predisposte per i widget. 

Se vuoi aggiungere una barra di ricerca nel menu, devi sfruttare altri plugin o widget in diverse aree del tuo sito web, incluso il intestazione e piè di pagina

Ecco perché in questo tutorial ti guiderò attraverso 3 diversi metodi per aggiungere una barra di ricerca sul tuo sito WordPress. 

Ora diamo un'occhiata a come puoi aggiungere una barra di ricerca al tuo sito web tramite il widget predefinito di WordPress.

Aggiungi la barra di ricerca con il widget di ricerca predefinito di WordPress:

Il modo più semplice e conveniente per inserire una barra di ricerca nel tuo sito Web WordPress è tramite la dashboard di WordPress. Come farlo? Controlliamolo-

Passare ai widget dalla dashboard:

All'inizio, vai alla dashboard del tuo pannello di amministrazione e trova Aspetto. Navigare e fare clic su Widget da un elenco di elementi in Aspetto.   

Dashboard > Aspetto > Widget

Passare ai widget dalla dashboard

Aggiungi il widget di ricerca dai widget disponibili:

Questo ti porterà a una nuova pagina visualizzata con diverse sezioni di pagina. Ora premi il pulsante “Aggiungi blocco” (appare con un segno +) per visualizzare tutti i widget esistenti. 

Scorri verso il basso per trovare il widget di ricerca oppure puoi scrivere "Cerca" nel campo di ricerca per trovare il widget di ricerca.

Fai clic sulla sezione in cui vuoi che venga visualizzata la barra di ricerca, quindi premi il widget di ricerca. In alternativa, puoi anche trascinare e rilasciare il widget di ricerca nella sezione desiderata.

Aggiungi il widget di ricerca

Apporta le modifiche necessarie:

La barra di ricerca verrà ora visualizzata nella sezione selezionata. Puoi apportare le modifiche necessarie a diversi elementi come l'allineamento della barra di ricerca, la posizione dei pulsanti, il colore del testo e così via. 

Puoi anche aggiungere un'etichetta personalizzata alla barra di ricerca secondo le tue esigenze. Infine, fai clic sul pulsante Aggiorna.

Personalizza la barra di ricerca

Visualizza la barra di ricerca sulla tua pagina:

Ora, se visiti una qualsiasi delle tue pagine o post pubblicati, puoi notare la barra di ricerca o la casella di ricerca visualizzata nella barra laterale principale.

Visualizza la barra di ricerca sul front-end

Aggiungi la barra di ricerca con il widget di ricerca ElementsKit:    

Ora te ne mostrerò un altro un modo semplice per aggiungere la barra di ricerca di WordPress al tuo sito. E questo avviene tramite il widget Ricerca intestazione di ElementsKit. È semplicissimo aggiungere una casella di ricerca tramite ElementsKit

È un dato di fatto, ElementsKit è un componente aggiuntivo di Elementor. In questo senso, aggiungere una barra di ricerca con ElementsKit può essere definita anche una barra di ricerca Elementor, giusto?

Senza ulteriori indugi, diamo un'occhiata come aggiungere la barra di ricerca con il widget di ricerca ElementsKit

Passa a uno qualsiasi dei tuoi post o pagine esistenti dalla dashboard:

Prima di tutto, vai sulla dashboard e trova post o pagine. Qui mostrerò come funziona il widget ElementsKit con un post chiamato "Hello World!" 

Vai su "Post" e seleziona "Tutti i post" per visualizzare tutti i tuoi post. Da lì, puoi scegliere il post in cui desideri aggiungere una barra di ricerca. Nel caso in cui non hai alcun post o una pagina esistente, devi aggiungere un nuovo post o pagina.

Dashboard > Post > Tutti i post > Il tuo post

Vai a una qualsiasi delle pagine esistenti

Passa alla finestra Elementor:

Ora fai clic su "Modifica con Elementor" situato in alto al centro. Questo ti porterà alla finestra di Elementor.

Passa alla finestra dell'elementor

Trascina e rilascia il widget di ricerca dell'intestazione: 

Nella finestra di Elementor avrai accesso a tantissimi widget. Digita il widget "Ricerca intestazione" nel campo di ricerca per trovare il widget. In alternativa, puoi scorrere verso il basso e trovare anche il widget. 

Una volta rintracciato il widget, trascinalo nell'area designata per visualizzare la barra di ricerca. Non dimenticare di aggiungere la sezione sopra il testo del tuo post poiché è una barra di ricerca dell'intestazione.

Trascina e rilascia il widget di ricerca dell'intestazione

Imposta i parametri della barra di ricerca:

Una volta visualizzata la barra di ricerca sulla pagina, è il momento di impostare i parametri della barra secondo le tue preferenze. Nella scheda Contenuto, avrai una sezione Ricerca intestazione in cui inserisci un testo segnaposto, seleziona un'icona di ricerca e regola la dimensione del carattere. 

Imposta i parametri della barra di ricerca nella scheda contenuto

Nella scheda Stile avrai 2 sezioni: Ricerca intestazione e Contenitore di ricerca. Dalla sezione Ricerca intestazione, puoi regolare parametri come colore di sfondo, tipo di bordo, ombra della casella di ricerca, margine, ecc. della barra di ricerca.

Imposta i parametri della barra di ricerca nella scheda stile per la sezione di ricerca dell'intestazione

Dalla sezione Contenitore di ricerca, puoi selezionare il tipo di sfondo e impostare il testo segnaposto e il colore del bordo.

Imposta i parametri della barra di ricerca nella scheda Stile per la sezione del contenitore di ricerca

Finalmente sei a posto!

Dopo aver finalizzato le impostazioni, sei pronto per controllare e visualizzare la barra di ricerca nella parte anteriore del tuo post. Se non sei soddisfatto dell'aspetto della casella di ricerca, sei libero di modificarla nuovamente dal pannello di amministrazione. 

Visualizza la barra di ricerca dell'intestazione nel tuo post

È un gioco da ragazzi aggiungere la ricerca ai siti WordPress con ElementsKit, non è vero? Oltre a ciò, otterrai numerosi vantaggi aggiungendo una barra di ricerca al tuo sito WordPress che ho elencato sopra. Quindi, perché non provare ElementsKit?

ElementsKit è un componente aggiuntivo all-in-one per il page builder Elementor che include potenti moduli, widget, megamenue intestazione e piè di pagina.

Aggiungi casella di ricerca con codice CSS:

C'è un altro modo che puoi utilizzare per aggiungere una barra di ricerca al tuo sito ed è utilizzare il codice CSS. Anche se sono necessarie un po' di conoscenze tecniche per farlo, non è scienza missilistica. Ti mostrerò il processo qui e dopo sarà semplicissimo. 

Vai all'editor del tema:

Prima di tutto, fare clic su “Aspetto"Dalla dashboard e vai alla voce"Redattore del tema”. 

Passare all'editor del tema

Apri il file header.php o sidebar.php:

Con ciò, passerai al file style.css per impostazione predefinita. Da lì, apri il file intestazione.php O barra laterale.php file a seconda della posizione in cui desideri che venga visualizzata la barra di ricerca.

Apri il file header.php o il file sidebar.php

Aggiungi la funzione della barra di ricerca:

Ora aggiungi questa funzione <?php get_search_form(); ?> nel codice del file header.php o sidebar.php. Ho aggiunto la funzione nel codice del file header.php. 

Aggiungi una funzione di barra di ricerca

Visualizza la barra di ricerca sul tuo sito:

Infine, apri una qualsiasi delle tue pagine pubblicate e noterai la barra di ricerca visualizzata in alto. Se aggiungessi la funzione nel file sidebar.php, la barra di ricerca apparirà sulla barra laterale. 

La barra di ricerca viene visualizzata nella pagina

Conclusione:

Questo è! Ti ho attraversato 3 tecniche semplicissime per aggiungere una barra di ricerca al tuo sito Web WordPress. A seconda delle tue esigenze, puoi optare per uno qualsiasi di essi. Tuttavia, se aggiungi la barra di ricerca di WordPress con il widget di ricerca dell'intestazione di ElementsKit, otterrai un ulteriore vantaggio.

Che cos'è? Opzioni di personalizzazione infinite!!! Quindi, se ami la personalizzazione, utilizza il widget di ricerca dell'intestazione di ElementsKit. Con ciò, puoi dare alla tua barra di ricerca un aspetto affascinante. 

GIF promozionale di ElementsKit

Commenti

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *