Come aggiungere la barra di ricerca a un sito WordPress

La barra di ricerca è un elemento essenziale di un sito Web con cui nessuno sarebbe in disaccordo. Questo perché un sito Web contiene un sacco di informazioni attraverso la home page, le pagine dei prodotti, le pagine del blog, la pagina dei prezzi, ecc. Ecco perché è fondamentale aggiungere la barra di ricerca al tuo sito WordPress.

Se hai bisogno di alcune informazioni esistenti su pagine diverse, come le troverai? Li troverai a visitare quelle pagine individualmente? Sicuramente, non ti piacerebbe farlo. Non che non troverai le informazioni richieste in questo modo. Ma è anche dispendioso in termini di tempo e nauseante. È qui che entrerà in gioco l'aggiunta di una barra di ricerca al tuo sito.

Perché aggiungere una barra di ricerca nel tuo sito?

Supponiamo che tu non abbia una barra di ricerca sul tuo sito. In tal caso, quando i visitatori visiteranno il tuo sito, avranno difficoltà a trovare le informazioni richieste. Di conseguenza, lasceranno il tuo sito e tutto il tuo scopo di inserirli nel sito web andrà invano.

Lascia che ti presenti alcuni dei principali vantaggi che puoi ottenere aggiungendo una barra di ricerca nel tuo sito di seguito-

• 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 poche parole chiave riducendo lo sforzo

Aggiunta di una barra di ricerca al menu con il widget di ricerca predefinito di WordPress:

Puoi aggiungere la barra di ricerca al menu con il widget di ricerca predefinito di WordPress? No, non puoi. Perché WordPress ti consente di aggiungere la barra di ricerca solo nelle aree pronte per i widget.

Se desideri aggiungere la barra di ricerca al menu, devi sfruttare altri plug-in o widget in diverse aree del tuo sito Web, inclusi intestazione e piè di pagina.

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

Ora, diamo un'occhiata al modo in cui puoi aggiungere la 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 è attraverso la dashboard di WordPress. Come farlo? Controlliamolo-

Passa 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

Aggiungi il widget di ricerca dai widget disponibili:

Questo ti porterà a una nuova pagina che appare con diverse sezioni di pagina. Ora, premi il pulsante "Aggiungi blocco" (appare con il 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 desideri visualizzare la barra di ricerca, quindi premi il widget di ricerca. In alternativa, puoi anche trascinare e rilasciare il widget di ricerca nella sezione desiderata.

Apporta le modifiche necessarie:

La barra di ricerca apparirà ora sotto la sezione selezionata. Puoi apportare le modifiche richieste a diversi elementi come l'allineamento della barra di ricerca, la posizione del pulsante, 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.

Visualizza la barra di ricerca nella tua Pagina:

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

Aggiungi barra di ricerca con il widget di ricerca ElementsKit:

Ora, ti guiderò attraverso un altro modo semplice per aggiungere una barra di ricerca nel tuo sito WordPress. E questo è attraverso il widget Ricerca intestazione di ElementsKit. È semplicissimo aggiungere una casella di ricerca tramite ElementsKit.

Senza ulteriori indugi, diamo un'occhiata-

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

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

Vai su "Post" e quindi 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 tu non abbia alcun post o pagina esistente, devi aggiungere un nuovo post o pagina.

Dashboard > Post > Tutti i post > Il tuo post

Passa alla finestra di Elementor:

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

Trascina e rilascia il widget di ricerca intestazione:

Nella finestra di Elementor, avrai accesso a tonnellate di 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.

Dopo aver 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 in quanto è una barra di ricerca dell'intestazione.

Imposta i parametri della barra di ricerca:

Una volta visualizzata la barra di ricerca nella 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.

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

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

Finalmente sei a posto!

Dopo aver finalizzato le impostazioni, sei pronto per controllare e visualizzare la barra di ricerca sul front-end del tuo post. Se non sei soddisfatto dell'aspetto della casella di ricerca, sei libero di modificarlo nuovamente dal pannello di amministrazione.

Aggiungi casella di ricerca con codice CSS:

C'è un altro modo che puoi usare per aggiungere una barra di ricerca nel tuo sito ed è usare il codice CSS. Anche se hai bisogno di un po' di conoscenza tecnica per farlo, non è scienza missilistica. Ti mostrerò il processo qui e dopo sarà semplicissimo.

Vai all'editor dei temi:

Prima di tutto, fai clic su "Aspetto" dalla dashboard e vai a "Editor temi".

Apri il file header.php o sidebar.php:

Con ciò, passerai al file style.css per impostazione predefinita. Da lì, apri il file header.php o sidebar.php a seconda della posizione in cui desideri visualizzare la barra di ricerca.

Aggiungi funzione 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.

Visualizza la barra di ricerca sul tuo sito:

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

In chiusura:

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

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