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 si utilizza un Sito istantaneo di Ecwid, è possibile personalizzare l'aspetto della casella di ricerca sul sito.

Customizing_the_search_box__2_.png

Per cambiare l'aspetto della casella di ricerca:

  1. Nel pannello di controllo di Ecwid, andare a Panoramica → Gestisci sito istantaneoModifica sito (o Sito webModifica sito).
  2. Cliccare sul blocco Intestazione.
  3. Passare alla scheda Design e fare clic sulla voce Icona di ricerca.
  4. Fare clic sul campo Colore e scegliere il colore desiderato con l'aiuto dello strumento di selezione del colore:

    Customizing_the_search_box__1_.png

    Inoltre, se si conosce già il codice del colore desiderato, è possibile immetterlo nel campo Colore.
  5. Premere Salva e pubblica.

Il colore impostato sarà utilizzato per l'icona di ricerca e per i testi digitati nel campo di ricerca.

Queste istruzioni sono valide per il Sito istantaneo di ultima generazione. Se si usa la versione originale del Sito istantaneo di Ecwid, per cambiare l'aspetto della casella di ricerca è possibile usare il seguente codice CSS (in inglese).

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: 0 su 1
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