Il Widget Editor è il fulcro di tutti i vostri widget React. È stato progettato sia per professionisti che per principianti, quindi non è necessario possedere conoscenze preliminari di CSS.
Potete trovarlo in Configura shop > Integrazione sul sito > Widget Editor.
Sviluppo ancora in corso
Puoi già usare il Widget Editor ma con funzionalità ridotte. La quantità di cose che puoi fare aumenterà in futuro.
Le funzionalità mancanti sono evidenziate in questo articolo.
Le funzionalità mancanti sono evidenziate in questo articolo.
1. Panoramica
Una volta aperto il Widget Editor vedrete due sezioni principali.
I tuoi widget si tratta della creazione e della configurazione dei tuoi widget.
Impostazioni di design è il posto dove andare quando vuoi cambiare l'aspetto dei tuoi widget.
Cominciamo prima con i tuoi widget!
2. Creare e personalizzare i propri widget
Nella sezione I tuoi Widget puoi configurare e gestire tutti i widget che hai creato nel Widget Editor. Sono ordinati per tipo di widget.
2.1 Scegliere un tipo di widget
Attualmente è possibile scegliere tra tre tipi di widget:
- Catalog widget: Panoramica di più prodotti
- Product Widget: Pagina dettagliata di un prodotto
- Booking Widget: Modulo di prenotazione con calendario
Outlook sui tipi di widget
Seguiranno presto altri tipi di widget, una volta che saranno stati aggiornati alla nuova infrastruttura di React. L'obiettivo è quello di includere tutti i widget che offriamo.
2.2 Configurare le impostazioni del widget
Le impostazioni dipendono dal tipo di widget che avete appena scelto.
Se si tratta del Catalog Widget o Booking Widget è possibile selezionare la lingua del prodotto e il prodotto che si desidera visualizzare.
Se hai scelto il Product Widget puoi selezionare la lingua del prodotto e filtrare i prodotti per categoria e località.
Le categorie sono quelle che tu stesso hai creato e organizzato. Se vuoi avere maggiori informazioni su come organizzare le tue categorie, leggi questo articolo.
Puoi usare il filtro di localizzazione in aggiunta o in modo autonomo. La località sarà determinata dal parametro Città che inserisci. Per aumentare o ridurre la quantità di prodotti mostrati nel widget del catalogo, puoi inserire un raggio in cui il prodotto deve essere incluso per essere visualizzato.
2.3 Scegliere un design
In questo passaggio puoi selezionare il tema con cui il widget deve essere visualizzato. Per cambiare i singoli colori, dai un'occhiata alle impostazioni di Design!
Suggerimento
La selezione del tema può essere utile quando si aggiorna regolarmente il design.
Immaginiamo che cambiate il look del vostro sito web a ogni stagione. Puoi facilmente adattare il widget al nuovo design senza dover cambiare nulla nel backend.
2.4 Definire il contenuto visibile
Se avete selezionato il Product Widget o Catalog Widget potete decidere quali informazioni il cliente vede nel widget.
Puoi personalizzare la casella del prodotto, definire secondo quali caratteristiche il cliente può filtrare e decidere anche quanto deve essere dettagliata la pagina del prodotto.
2.5 Salvataggio e pubblicazione
Nell'ultimo passo dai un nome e una descrizione al tuo widget. Entrambi saranno visibili nella panoramica.
Una volta cliccato su Salva, viene generato un codice HTML. Puoi incorporare questo codice nel tuo sito web.
Suggerimento
Devi integrare il codice nel tuo sito web solo una volta! Ogni cambiamento che fai nel Widget Editor influenzerà anche il widget sul tuo sito web.
3. Creare un design
Le impostazioni di design ti permettono di creare temi e quindi di cambiare l'aspetto dei tuoi widget. I temi consistono in colori e caratteri.
3.1 Colori e caratteri
Per quanto riguarda il colore, avete attualmente accesso al colore dominante che influenza i pulsanti primari ("Prenota qui" e "Aggiungi al carrello").
Potete scegliere tra 8 caratteri diversi e 5 dimensioni di carattere.
Più personalizzazioni in arrivo
Quest'area sarà ampiamente migliorata in futuro in modo da poter accedere non solo al colore dominante ma anche al colore secondario, al colore dello sfondo, al colore del carattere ecc.
3.2 Salvare e pubblicare
Dopo aver finito di modificare il tuo design globale, puoi dargli un nome e una descrizione. Quando premi su "Salva le ultime modifiche", tutti i widget con il design si aggiorneranno automaticamente.
Se non hai ancora selezionato il design per nessuno dei tuoi widget, vedi il capitolo 2.3 su come procedere.
Suggerimento
Se hai dimenticato di salvare le ultime modifiche, riceverai una notifica in merito alle modifiche non salvate nella panoramica del Widget Editor.