L’editor in sintesi
In alto c’è la barra superiore: “← I tuoi siti web” riporta alla panoramica, “Scegli la pagina” passa dalla home page alle sottopagine, “Desktop”, “Tablet” e “Telefono” cambiano l’anteprima, ↶ e ↷ annullano e ripristinano. Accanto vedi se tutto è salvato, quanto spazio è libero nella tua barra IA, “Porta con te”, lo stato della pagina e, all’estrema destra, “Pubblica”.
A sinistra trovi le aree di lavoro, divise in tre gruppi: in “Personalizza il sito” ci sono “Sito web”, “Sezioni”, “Pagine e menu”, “Menu e piè di pagina”, “Colori e carattere” e “Modifica con Kenji”; in “Collega gli strumenti” ShopBuilder, FormBuilder e DomainStudio; in “Gestisci” “Impostazioni”, “Membri”, “Su Google” e “Azienda”. Al centro c’è la tua vera pagina, a destra lo strumento relativo all’elemento su cui fai clic.
“Impostazioni” raccoglie l’essenziale di un sito: “Nome del sito” e “Lingua del sito” (la lingua vale per le parole fisse come pulsanti, contatti e messaggi di errore; i tuoi testi non vengono tradotti), più “Porta con te” e “Elimina il sito”. Per tutto ciò che ha già un suo posto, lì trovi solo il collegamento per arrivarci: “Su Google”, “Membri” e “Indirizzo in DomainStudio”. Se il sito usa un marchio, lì è indicato insieme a “Assegna in BrandStudio”.
Sugli schermi più piccoli, anche su molti laptop, l’editor mostra una colonna alla volta: in basso passi tra “Sezioni”, “Anteprima” e “Strumento”, e le aree di lavoro si trovano dietro “Scegli area di lavoro”. Sul telefono l’indicatore IA, “Porta con te”, lo stato della pagina e “Metti offline” si trovano dietro “Mostra altro”.
Il salvataggio è automatico. Se nella barra superiore compare “Non salvato”, una riga rossa ne indica il motivo, con accanto “Salva di nuovo”.
Scrivere direttamente nella pagina
Titoli, paragrafi, testi dei pulsanti e punti degli elenchi li modifichi lì dove si trovano: fai clic nel testo e scrivi. L’anteprima è la tua vera pagina, non una copia affiancata.
Invio conferma, Esc ripristina il testo precedente. Un testo è sempre su una sola riga: gli a capo diventano spazi. Nell’editor i link non portano da nessuna parte; un clic serve solo a selezionare.
Le modifiche vengono salvate nella bozza poco dopo che hai scritto. Sul web non cambia nulla finché non pubblichi.
- Nell’anteprima fai clic sul testo che vuoi modificare.
- Scrivi il nuovo testo.
- Premi Invio o fai clic altrove per confermarlo. Con Esc annulli ciò che hai scritto.
Scrivere non consuma credito IA.
Cosa c’è nel piè di pagina
Il piè di pagina lo compili nell’area “Menu e piè di pagina”, in “Piè di pagina”. Le righe dei contatti provengono dai dati della tua azienda e si gestiscono lì. In “Collega pagine esistenti” stabilisci per ogni pagina se è “Non nel piè di pagina”, nell’“Elenco di link” o tra i “Link legali”, indipendentemente dal fatto che sia nel menu in alto. Lì compaiono solo le pagine pubbliche, mai una pagina riservata ai membri.
I “Link personalizzati” sono composti da nome e destinazione del link: una pagina del tuo sito, una sezione o un indirizzo con https://, mailto: o tel:. Il campo non accetta una destinazione non sicura. In “Social network” scegli la “Fonte dei profili”: i dati della tua azienda o profili personalizzati per il piè di pagina, al massimo dieci. I social network più noti compaiono con la loro icona e il loro nome per gli screen reader.
Con “Colonne personalizzate” organizzi fino a quattro colonne con un titolo, ciascuna con un massimo di dieci voci: pagine, link, contatti, social network. “Chiusura con un’azione” aggiunge un pulsante alla fine; senza un testo proprio usa il pulsante dell’intestazione. La “Nota a piè di pagina” è una riga libera in fondo alla pagina. Il piè di pagina inserisce automaticamente il link alle note legali del tuo marchio.
- Apri “Menu e piè di pagina” e in alto scegli “Piè di pagina”.
- Apri un’area, ad esempio “Link personalizzati”, inserisci nome e destinazione del link e fai clic su “Aggiungi link”.
- Controlla “Anteprima del tuo piè di pagina” e fai clic su “Salva design”.
Un link iniziato o un profilo compilato a metà va prima aggiunto o svuotato, altrimenti non è possibile salvare il design.
Inserire il tuo negozio nella pagina
Se hai un negozio in ShopBuilder ai, puoi portarlo nel tuo sito in due modi: come sezione a sé in una pagina o come voce del menu. Un clic su “ShopBuilder” nella barra mostra i tuoi negozi accanto alla pagina, ciascuno con i suoi prodotti e le sue categorie attivi: “Inserisci” lo aggiunge come nuova sezione dopo quella che hai selezionato, “Nel menu” lo inserisce come voce di menu. Nella sezione scegli a destra la “Visualizzazione”: “Assortimento” mostra la tua offerta direttamente nella pagina, “Solo pulsante” porta al negozio con un pulsante. Puoi aggiungere la sezione anche tramite “+ Aggiungi sezione” → “Negozio” e scegliere il negozio a destra.
Cosa mostra la sezione lo imposti a destra in “Cosa mostrare?”: “Tutto l’assortimento”, “Una categoria” o “Singoli prodotti” (al massimo 24, nell’ordine in cui li spunti, riordinabili con ↑ e ↓). A questo si aggiungono “Ordine”, “Al massimo” (0 significa: mostra tutti), il “Campo di ricerca sopra i prodotti” e “Mostra le categorie come filtri”. Il campo di ricerca è disponibile da quattro prodotti selezionati in su, le categorie da due in su. Lo stesso negozio può comparire più volte in una pagina, ogni sezione con la propria selezione; se nella sezione scegli un altro negozio, la sua selezione riparte da zero. Se rinomini una categoria in ShopBuilder, la sezione te lo segnala e scegli di nuovo.
Il catalogo adotta i colori e il carattere di questo sito, così non sembra un corpo estraneo; il design del negozio che hai salvato resta invariato. Gli acquisti avvengono sempre nel negozio: ogni clic su un prodotto o nel carrello porta all’indirizzo del tuo negozio, dove si trovano cassa e pagamento. Nel sito non esiste una seconda cassa.
Vengono proposti solo i tuoi negozi. Sotto la selezione vedi lo stato del negozio: “Negozio accessibile”, “Questo negozio non ha ancora prodotti attivi.” (in questo caso compare solo il pulsante) oppure “Questo negozio non è ancora accessibile al pubblico.” I visitatori non vedono un negozio ancora in bozza; al suo posto compare una breve frase.
- Nella pagina seleziona la sezione dopo la quale deve comparire il negozio e a sinistra, in “Collega gli strumenti”, fai clic su “ShopBuilder”.
- Accanto alla pagina, sul tuo negozio fai clic su “Inserisci” oppure su “Nel menu”.
- A destra, in “Visualizzazione” e “Cosa mostrare?”, imposta cosa mostra la sezione.
- Pubblica il sito; solo allora compare il collegamento.
“Altre opzioni” sotto l’elenco apre l’area ampia: lì scegli negozio, visualizzazione e selezione già prima di inserirlo e fai clic su “Inserisci in questa pagina” o “Aggiungi al menu”. Prodotti, prezzi e ordini li gestisci in ShopBuilder ai: maggiori dettagli nel capitolo ShopBuilder ai.
Aggiungere, ordinare, duplicare ed eliminare sezioni
Ogni pagina è una sequenza di sezioni. Con “Sezioni” apri l’elenco a sinistra: in alto l’“Intestazione”, sotto le sezioni nell’ordine della pagina. Con un clic l’anteprima salta a quel punto.
Le nuove sezioni le aggiungi con “+ Aggiungi sezione”; il catalogo “Che tipo di sezione?” mostra ogni tipo con un piccolo disegno. La nuova sezione viene inserita dopo quella selezionata. Per riordinare trascina oppure usa le frecce ↑ e ↓, che funzionano anche senza mouse.
A destra della sezione selezionata trovi “Duplica sezione” (la copia viene creata senza immagine) e “Elimina sezione”, con una richiesta di conferma. Una pagina contiene fino a 14 sezioni; ogni sottopagina ha il proprio elenco.
- Fai clic su “Sezioni” a sinistra.
- Seleziona una sezione, fai clic su “+ Aggiungi sezione” e poi su un tipo.
- Trascina le sezioni al loro posto oppure usa ↑ e ↓.
- Per eliminare: fai clic sulla sezione, poi a destra su “Elimina sezione”, quindi su “Sì, elimina”.
Nessuna di queste operazioni consuma credito IA, e “Annulla” ripristina una sezione eliminata.
Dieci tipi di sezione
“Testo” per tutto ciò che racconta qualcosa, con un’immagine se vuoi. “Servizi” per punti affiancati. “Contatti” con indirizzo, telefono, e-mail, orari di apertura e un modulo che invia davvero. “Invito all’azione” è una fascia colorata con un pulsante. “Domande e risposte” si apre e si chiude. “Testimonianze” mostra citazioni, “Prezzi” mostra offerte come schede informative senza cassa. “Immagine” è una grande immagine con didascalia, “Modulo” incorpora un modulo da FormBuilder ai, “Negozio” il tuo negozio.
Servizi, domande e risposte, testimonianze e prezzi sono composti da “Punti”. Li gestisci a destra: due campi per punto, “+ Aggiungi punto” fino a dodici, ↑ e ↓ per riordinare, ✕ per rimuovere. Le nuove sezioni includono segnaposto neutri: nessuna testimonianza inventata, nessun prezzo inventato.
Domande e risposte vengono inoltre inserite nella pagina in un formato leggibile dalle macchine, così Google può riconoscerle. Volutamente non ci sono altri tipi: ognuno deve avere un bell’aspetto con qualsiasi stile e funzionare sul telefono.
- Nell’anteprima fai clic su una sezione con punti, ad esempio “Prezzi”.
- A destra, in “Punti”, modifica i campi; la modifica viene applicata non appena esci da un campo.
- Fai clic su “+ Aggiungi punto” per aggiungere un altro punto.
I segnaposto delle nuove sezioni esistono in tedesco e in inglese; su un sito in un’altra lingua li sovrascrivi direttamente.
L’intestazione
L’intestazione di ogni pagina può avere tre strutture: “Testo centrato” (un’immagine, se c’è, compare sotto), “Immagine come sfondo” con immagine scurita e testo chiaro, e “Testo a sinistra, immagine a destra”. “Immagine come sfondo” richiede un’immagine; se manca, la pagina mostra “Testo centrato” e, già prima, a destra compare “Per questo serve un’immagine — scegline una qui sotto.”
Il titolo, la frase sotto e il testo del pulsante li scrivi direttamente nella pagina. Senza testo, nella pagina pubblicata non c’è alcun pulsante. Dove porta lo scegli in “Il pulsante porta a” (vedi I pulsanti puntano alle pagine). Lo stesso pulsante compare in alto a destra nella barra dell’intestazione se c’è una sezione contatti o se il pulsante ha una destinazione.
- Nell'elenco delle sezioni fai clic su “Intestazione” oppure, nell'anteprima, nella parte alta della pagina.
- A destra, sotto “Struttura”, scegli una delle tre forme.
- Se vuoi, aggiungi un'immagine con “Scegli immagine”.
Fare a meno dell'immagine non è un ripiego: un'intestazione sobria con una frase chiara è spesso un inizio migliore di una foto stock.
Sfondo, lato dell'immagine, allineamento
Per ogni sezione scegli a destra uno “Sfondo”: “Come la pagina”, “Superficie chiara” o “Accento delicato”. Per “Testo” stabilisci sotto “Immagine accanto al testo” se un'immagine sta a sinistra, a destra o se non c'è affatto; “Allineamento” imposta il testo “A sinistra” o “Centrato”.
Questi pochi interruttori danno il ritmo alla pagina — fasce alternate separano gli argomenti meglio di qualsiasi linea. La fascia “Invito all’azione” è sempre sul colore di accento; il suo sfondo non si può cambiare.
- Nell'anteprima fai clic su una sezione.
- A destra scegli “Sfondo”, per le sezioni di testo “Immagine accanto al testo”, e l'“Allineamento”.
Anteprima per dispositivo
Con “Desktop”, “Tablet” e “Telefono” nella barra superiore vedi la pagina a tutta larghezza, a 768 e a 390 pixel di larghezza. Non è un'imitazione, ma la tua pagina in una cornice più stretta — va a capo esattamente come per i visitatori, compreso il menu che sul telefono si apre a scomparsa.
La maggior parte dei visitatori arriva dal telefono. Darci un'occhiata prima di pubblicare è il test più economico che esista.
- Fai clic su “Telefono” in alto.
- Scorri la pagina e controlla menu, immagini e pulsanti.
- Con “Desktop” torni alla larghezza piena.
Annulla e ripeti
↶ e ↷ nella barra superiore annullano e ripristinano i passaggi — fino a cinquanta, finché l'editor resta aperto. Servono per la pagina stessa: testi digitati, sezioni che hai aggiunto, spostato, duplicato o eliminato, i punti di una sezione, il carattere e una modifica fatta da Kenji.
“Annulla” non riporta indietro ciò che ha un proprio modo di salvataggio: i dati sotto “Azienda”, “Su Google”, “Pagine e menu”, “Menu e piè di pagina” e “Membri”. Quando chiudi l'editor, la cronologia sparisce; la pagina pubblicata non ne è toccata finché non pubblichi di nuovo.
- Fai clic su ↶ (Annulla) per annullare l'ultimo passaggio.
- Fai clic su ↷ (Ripeti) per ripristinarlo.
Annullare non consuma credito IA. Se annulla una modifica di Kenji, il credito IA usato per farla resta consumato.
Modificare con Kenji
Invece di cercare i campi, dici a Kenji cosa deve cambiare: “Accorcia il titolo e aggiungi una sezione sulla nostra colazione.” Gli parli nella finestra di Kenji in basso a destra, la stessa finestra che trovi ovunque in KENJTEC. In alto indica su cosa stai lavorando: lo strumento, il nome del tuo sito, la pagina aperta e la sezione che hai scelto. Kenji riscrive la pagina che è in anteprima in quel momento, e la modifica finisce nella bozza. Kenji può riscrivere testi, aggiungere, riordinare o rimuovere sezioni e far cercare una nuova immagine per un punto.
Kenji risponde a parole: prima dice in una frase cosa sta facendo, poi l'editor modifica la pagina e sotto compare “Fatto: la modifica è nella bozza. Va online solo con «Pubblica».” Se fai solo una domanda, per esempio “Cosa posso migliorare in questa pagina?”, risponde invece di modificare qualcosa. Se hai appena scritto qualcosa, l'editor lo salva prima; se non ci riesce, Kenji non modifica nulla e nella finestra compare “Prima salva: la tua ultima versione non è ancora salvata.”
Restano intatti i dati della tua azienda, pagine e menu, l'aspetto di menu e piè di pagina, le impostazioni su Google, i tuoi colori, le impostazioni del tuo marchio e il tuo codice in modalità sviluppatore. Per questo una frase rivolta a Kenji non cambia i colori che hai scelto tu o che provengono dal marchio — per quello c'è “Colori e carattere”.
Se il risultato non ti piace, “Annulla” nell'editor riporta lo stato precedente.
- Nell'editor fai clic a sinistra su “Modifica con Kenji”, oppure in basso a destra sul pulsante rotondo con la K.
- Scrivi quello che vuoi nel campo “Di’ cosa deve cambiare, oppure chiedimi qualcosa…” e premi Invio.
- Aspetta che nella finestra compaia “Fatto” e che l'anteprima mostri il nuovo stato.
Ogni modifica nella conversazione consuma credito IA; se non riesce, non viene addebitato nulla. Se la tua barra IA è vuota, si ricarica da sola, oppure aggiungi un pacchetto IA — vedi Account e fatturazione.
Proposte di testo per un punto
Se un singolo testo non convince, chiedi proposte proprio per quel punto. Sotto “Azienda” → “Testi” trovi i testi della home page: “Titolo nell'intestazione”, “Frase sotto”, “Etichetta del pulsante”, “Sottotitolo del sito”, titolo e testo di ogni sezione e la “Riga nel piè di pagina”.
Lì puoi cambiare il testo a mano e inserirlo con “Applica”. Oppure usi uno dei quattro pulsanti: “Più corto”, “Più lungo”, “Tono diverso” o “Tre proposte”. Kenji fornisce tre versioni, elencate una sotto l'altra, e solo il tuo clic ne inserisce una. Fino ad allora il tuo testo resta com'è.
- Fai clic a sinistra su “Azienda” e apri “Testi”.
- Espandi il punto che vuoi modificare.
- Fai clic su “Più corto”, “Più lungo”, “Tono diverso” o “Tre proposte”.
- Fai clic sulla versione che ti piace — è subito nella bozza.
Le proposte consumano credito IA; applicare una versione o cambiare il testo a mano non ne consuma.