Knowledge base
Guide
Accademia
Tutorial video
Prova a cercare:
Articoli visualizzati di recente:

Sommario

Personalizzare la casella di ricerca

La funzione di ricerca dei prodotti aiuta i clienti a trovare gli articoli di cui hanno bisogno tra quelli disponibili in negozio. È possibile cambiare l'aspetto della casella di ricerca per adattarlo allo stile del negozio. Inoltre, per potenziare la funzione di ricerca, si possono usare le applicazioni dal Mercato delle applicazioni di Ecwid.

Cambiare l'aspetto della casella di ricerca sul Sito istantaneo

Se utilizzi il Sito istantaneo di Ecwid per vendere i tuoi prodotti, puoi personalizzare l'aspetto della casella di ricerca sul sito tramite le impostazioni della sezione Menu e intestazione.

Search box on IS.png

Per cambiare l'aspetto della casella di ricerca:

  1. Dal pannello di controllo Ecwid, accedere a Canali di vendita → Gestisci Sito istantaneoModifica sito (o Sito webModifica sito).
  2. Fare clic sulla sezione Menu e intestazione nell'elenco a sinistra.
  3. Passare alla scheda Design e scegliere il layout a blocchi desiderato.
  4. Fare clic su Sfondo e scegliere lo stile e il colore dello sfondo della sezione interessata.
  5. Fare clic su Menu e icone e scegliere il tipo e il colore dei caratteri per le icone presenti nella sezione e per le query immesse nel campo di ricerca.
  6. Fare clic su Pubblica.

Fatto! Lo stile, il tipo di carattere e i colori prescelti saranno utilizzati per il campo di ricerca e le sue icone sul sito.

Le istruzioni sopra riportate si riferiscono al Sito istantaneo di ultima generazione. Se si sta usando la versione originale del Sito istantaneo Ecwid, occorre applicare il seguente codice CSS (in inglese) per cambiare l'aspetto della casella di ricerca.

Cambiare l'aspetto del widget di ricerca

Se si utilizza un widget di ricerca su un sito Wix (in inglese), Wordpress, ecc., o su un sito personalizzato, è possibile cambiare lo stile del campo di immissione e del pulsante di ricerca con il codice CSS.

Ulteriori informazioni per usare il codice CSS nel proprio negozio

Per personalizzare il design degli elementi del widget di ricerca, si possono usare i seguenti codici CSS:

  1. Stili del campo di immissione:Customizing_the_search_box__4_.png
    /*  Stili del campo di immissione */
    input.ecwid-search-widget__input[type="text"] {
     width: 100px; /* cambia larghezza secondo necessità*/
     height: 20px; /* cambia altezza secondo necessità*/
     border: solid 1px red; /* cambia colore bordo */
     background-color: blue; /* cambia colore sfondo */
     font-size: 12px; /* cambia dimensione carattere nel campo di ricerca */
     color: #000000; /* cambia colore carattere nel campo di ricerca */
    }
    Cambiare il codice colore #000000 secondo le proprie esigenze facendo riferimento alla tabella colori HTML.
  2. Stili del pulsante di ricerca:

    Customizing_the_search_box__3_.png

    /* Stili del pulsante "Cerca" */
    button.ecwid-search-widget__btn {
     width: 20px; /* cambia larghezza secondo necessità*/
     height: 10px; /* cambia altezza secondo necessità*/
     border: solid 1px #ffffff; /*cambia colore bordo */  
     background: transparent url(image/button_search.png) no-repeat bottom center !important; /*aggiungi immagine di sfondo*/
    }
    Cambiare il codice colore #ffffff secondo le proprie esigenze e sostituire image/button_search.png con il percorso reale assoluto dell'immagine di sfondo. Ad esempio: "http://www.example.com/images/button_bg.png"

Spostare la casella di ricerca

Se si utilizza un widget di ricerca su un sito personalizzato o su un sito Wordpress, è possibile cambiare la posizione della casella di ricerca con il codice CSS.

Per applicare il codice, bisogna aggiungerlo al tema CSS nel proprio pannello di controllo di Ecwid.

È possibile utilizzare il seguente codice CSS per spostare il widget di ricerca:

/* per spostare il widget di ricerca*/
.ecwid-search-widget {
max-width: 170px; /* cambia larghezza secondo necessità*/
position:relative;
margin-left: 400px; /* cambia margine sinistro secondo necessità*/
margin-top: 10px; /* cambia margine superiore secondo necessità*/
}

A seconda della posizione desiderata del widget di ricerca, immettere i rispettivi valori di margin-left e margin-top per spostarlo.

Se il negozio fa parte di un sito Wordpress, è possibile usare anche i seguenti codici:

  • Per spostare la casella di ricerca a destra:
    
    .ecwid-shopping-cart-search {
        text-align: right
    }
  • Per posizionare la casella di ricerca al centro:
    
    .ecwid-shopping-cart-search {
        text-align: center
    }
Se la funzione di ricerca fa parte di un negozio Ecwid su un sito Wix (in inglese), è possibile usare l'editor Wix per spostare facilmente la casella di ricerca. Basta aprire la pagina in cui si trova il negozio, fare clic sulla casella per selezionarla e trascinarla nella posizione desiderata. Una volta fatto, salvare e pubblicare le modifiche.

Migliorare la funzionalità di ricerca

Se si desidera potenziare la funzione di ricerca, è possibile usare una delle applicazioni dal Mercato delle applicazioni di Ecwid per aggiungere la ricerca avanzata al proprio negozio:

Disponibile con il piano: Venture, Business, Unlimited.

CloudSearch

L'applicazione CloudSearch permette di potenziare la ricerca nel negozio con suggerimenti automatici. Un elenco di prodotti e categorie suggeriti viene visualizzato mentre un cliente digita nel campo di ricerca. L'elenco mostra le informazioni di base dei prodotti e un'opzione per passare alle rispettive pagine di dettaglio.

Inoltre, CloudSearch offre varie funzionalità oltre ai suggerimenti automatici:

  • controllo ortografico: le query di ricerca con errori di ortografia restituiranno dei risultati
  • sinonimi: è possibile aggiungere parole simili per mostrare gli stessi risultati durante la ricerca
  • promozione di determinati prodotti quando un visitatore cerca una parola chiave specifica
  • visualizzazione delle statistiche di ricerca nel pannello di controllo di Ecwid

L'applicazione è a pagamento con un periodo di prova gratuita di 30 giorni.

Clickable Brand

L'applicazione Clickable Brand permette di migliorare l'esplorazione del negozio rendendo cliccabile l'attributo 'Marca'. Ciò consente di filtrare i prodotti per marca.

L'applicazione è a pagamento con un periodo di prova gratuita di 14 giorni.

Ulteriori informazioni per assegnare l'attributo 'Marca' ai prodotti →

Per aggiungere alla vetrina la funzione di ricerca per facet, si possono usare i filtri dei prodotti.
Questo articolo ti è stato utile?

Fantastico! Grazie per il tuo feedback!

Grazie per il tuo feedback!

Ci dispiace molto! Cosa è andato storto?
Utenti che ritengono sia utile: 2 su 9
10
Utilizziamo i cookie e tecnologie simili per ricordare le tue preferenze, misurare l'efficacia delle nostre campagne e analizzare i dati non personalizzati per migliorare le prestazioni del nostro sito. Scegliendo "Accetta", acconsenti all'utilizzo dei cookie.
Accetta i cookie Rifiuta