Visual Editor: modifica il sito sulla pagina

#Aprilo

La scheda Visual Editor si trova accanto a Studio in uno spazio di lavoro con un piano a pagamento; con Free la scheda non compare. L'editor riempie la finestra e la freccia in alto a sinistra torna al progetto. In alto trovi:

#Scegli cosa cambiare

• Fai clic su qualsiasi elemento della pagina, oppure trovalo in Layers. Apri la freccia di una riga per vedere cosa contiene; scegliendo sulla pagina si apre il percorso fino a quell'elemento.
• Il percorso in cima al pannello indica dove si trova l'elemento. Fai clic su un passaggio per sceglierlo, oppure premi Esc.
• Maiusc+clic per sceglierne più d'uno. Una modifica all'aspetto vale per tutti.
• Quando lo stesso elemento si ripete, come le schede di un elenco, si illuminano tutti, e una modifica all'aspetto li cambia tutti. Le parole di ciascuno restano sue.
• Fai clic con il tasto destro su qualsiasi elemento, oppure premi Shift+F10, per aprirne il menu.

Il menu del tasto destro

Una voce che non si può applicare resta attenuata e dice perché. Mentre scrivi, una piccola barra offre Bold, Italic, Link e Line break.

#Parole e link

Le parole conservate nei dettagli del tuo sito, come l'indirizzo email o il nome, cambiano ovunque compaiano, e il pannello indica in quanti punti. L'editor segnala un trattino usato come punteggiatura e propone una virgola, e un pulsante le cui parole vanno a capo su due righe. Quick edit nel pannello elenca ogni parola e immagine di una sezione in un unico modulo.

#L'aspetto

Il pannello ha cinque schede: Element, Motion, Quick edit, Site e Check. In Element, Look contiene Layout, Space inside e Space outside, Text, Fill, Stroke ed Effects. Un valore impostato alla larghezza che stai guardando appare pieno; uno ereditato da una larghezza più piccola appare in grigio, e passando sopra a un campo compare il suo pulsante per cancellarlo.

I colori sono i ruoli propri del tuo sito, mai un colore a sé, così il sito resta coerente. Le classi che il pannello non imposta vengono lasciate come sono, elencate sotto Kept as written.

La scheda Site imposta ciò che legge ogni sezione: i suoi Colours, il suo Type per titoli e testo, Text styles, Buttons, Boxes, e sotto Page modalità, angoli, larghezza e ritmo. La × accanto a un'impostazione la riporta al design del tuo sito.

#Aggiungi e disponi

• Add offre Section, Text, Heading, Button, Picture, Video, Icon, Divider, Form ed Embed. Clicca su uno per aggiungerlo dove hai scelto, oppure trascinalo dove deve andare.
• Un Embed mostra una pagina di un altro sito web. Mappe e player di Google, YouTube, Vimeo, Spotify, SoundCloud e Calendly funzionano su ogni sito; qualsiasi altro sito web va aggiunto prima in Settings, Preferences, Allowed websites.
• + Add section tra due sezioni offre Designed (gratis, le sezioni con cui costruisce Briks, nei colori del tuo sito), Blank (gratis) o Generate with AI, circa 5 crediti: le tue parole arrivano al costruttore come modifica.
• Picture nella scheda Element la sostituisce con Replace from your media, imposta il suo Alt text (o la segna come Decorative, nothing to read aloud), la ritaglia e imposta il punto che resta in vista a ogni larghezza. Section background… imposta un colore, un gradiente, un'immagine o un video dietro una sezione.
• Le sostituzioni di immagini entrano nella bozza e vanno online insieme alle altre tue modifiche.
• In Layers, la riga di una sezione nella home la sposta su o giù, la copia o la nasconde, e le sezioni nascoste sono elencate sotto Hidden from this page per mostrarle di nuovo. Nelle altre pagine, la riga di una sezione la sposta o la toglie dalla pagina. Rename dà a un livello un nome tuo, che serve solo all'editor e non viene mai pubblicato.

#Pagine

Pages elenca le pagine del sito. Add page avvia una Blank page o una Copy of a page, con il suo Title e il suo Address. Il menu di ogni pagina ha Search and share (il suo Search title, Search description, Hide from search engines e Share picture), Rename, Duplicate, Move up, Move down, Hide from menu e Delete. Eliminando una pagina ti viene chiesto dove devono portare invece i link che puntavano a lei. Le modifiche alle pagine restano nella bozza come tutte le altre.

#Lavoratelo insieme

• Una sola bozza condivisa. Le tue modifiche vengono salvate nella bozza del progetto un attimo dopo ognuna, quindi restano dopo un ricaricamento, una scheda chiusa o su un altro dispositivo, e le vede chiunque apra l'editor. La barra dice Draft saved · not live yet, con quando e da chi. Se qualcun altro ha modificato la bozza da quando l'hai aperta, una barra ti chiede di fare Reload prima di continuare.
• Chi altro è qui. I volti delle altre persone con l'editor aperto compaiono nella barra. Passa il cursore su uno di essi per vedere la pagina e l'elemento in cui si trova; l'elemento che ha scelto è evidenziato con un contorno del suo colore. Nulla viene bloccato.
• Comments. Scegli un elemento e premi C, oppure fai clic destro e scegli Comment. Scrivi @ per nominare qualcuno. Un commento arriva a 2.000 caratteri, è fissato all'elemento e ha Reply, Resolve e Open again. Tutti nello spazio di lavoro possono commentare, anche i Viewer; solo Editor, Admin e Owner possono risolvere. La campanella avvisa tutti, e le persone che nomini lo sanno anche nelle loro chat con il bot di Briks.

I Viewer possono aprire l'editor per guardare il sito e commentare. La pagina dice “You can look through this site here. Your role in this workspace can't change it.”

#Ask AI e il builder

Per qualcosa che il pannello non fa, come un nuovo elemento o un altro layout, Ask AI nel menu del clic destro, o Ask the builder in fondo alla scheda Element, invia le tue parole al costruttore riguardo all'elemento scelto, come una normale modifica che usa crediti:

• New design for this section e Fix the layout ti mostrano, prima dell'invio, quanto richiede di solito il lavoro rispetto al tuo saldo, per esempio Design it for about 5 credits. La modifica viene creata e pubblicata come un messaggio nello studio, e con Versions puoi tornare indietro.
• Ask about this… risponde a una domanda sull'elemento qui, gratis, senza costruire nulla.
• Pubblica o scarta prima la bozza: la creazione parte dal sito pubblicato, quindi l'editor te lo chiede prima di inviare.
• Write alt text in Picture è gratis se la descrizione dell'immagine è già salvata, altrimenti costa fino a 0.10 crediti. Use this la conserva.

La scheda Check esamina la pagina alla larghezza in cui ti trovi e cerca immagini senza testo alternativo, testi difficili da leggere, titoli fuori ordine, ordine di lettura, e link e pulsanti senza nome. Il controllo è gratuito; una correzione contrassegnata da Uses credits va al builder.

#Pubblica, o cambia idea

• Niente va online finché non pubblichi. Una bozza contiene fino a 300 modifiche.
• Publish scrive le modifiche nel codice del tuo sito e lo pubblica come nuova versione, di solito in circa mezzo minuto, senza usare crediti. Pubblicare svuota la bozza.
• Se una modifica non può essere fatta, non viene pubblicato nulla e l'editor dice quale e perché.
• Drop this change in Changes ne rimuove una. Discard draft nel menu ⋯ le scarta tutte, per chiunque modifichi il sito, e chiede prima conferma.
• History elenca le versioni del sito. Preview ne mostra una com'era quando è stata pubblicata, e Restore la rimette online; la tua bozza viene conservata. Vedi Versioni, annulla e ripeti.

#Scorciatoie da tastiera