Scrivere sulla pagina e aggiungere blocchi

Scrivere direttamente

Fai clic in un testo e digita: tutto qui. Quando selezioni un passaggio, compare una piccola barra per metterlo in grassetto, in corsivo, barrarlo, aggiungere un link, e un pulsante ✨ per ritoccarlo con l’IA. Nel pannello di destra, la scheda Blocco propone anche i titoli, gli elenchi, la citazione e l’allineamento.

In questa barra, l’elenco Stile del testo trasforma il paragrafo in cui si trova il cursore: Testo, Titolo da 1 a 4, Occhiello (una breve riga sopra un titolo) o Sommario (un paragrafo introduttivo, più grande). Ogni scelta è mostrata così come apparirà.

La scelta di un link propone una pagina, una sezione, un indirizzo e-mail o un altro sito, e anche un articolo del blog o un prodotto del negozio (schede Articolo e Prodotto). Il link segue l’articolo in ogni lingua del sito, e viene rimosso in modo pulito se l’articolo non è più pubblicato.

Aggiungere un blocco con il tasto «/»

1. Posiziona il cursore su una riga vuota.
2. Digita /: si apre il menu dei comandi, ordinato per categorie (Sezione, Testo, Media, Contenuto, Azione).
3. Digita qualche lettera per filtrare («gal» per Galleria), poi conferma.

Puoi anche fare clic su Inserisci un oggetto… nella scheda Blocco del pannello di destra.

I blocchi principali

• Testo e impaginazione: titoli, elenchi, citazione, Riquadro, Colonne (da 2 a 4 zone affiancate), Separatore, Spaziatore, Tabella, Indice.
• Media: Immagine, Galleria, Media (video, audio o contenuti YouTube, Vimeo, SoundCloud, Spotify…), Prima / dopo, Incorpora (una webcam, un calendario, un widget di recensioni… tramite il suo indirizzo o il suo codice HTML).
• Presentare la tua attività: Hero (banner con titolo e pulsanti), Funzionalità, Griglia di schede, Team, Testimonianze, Cifre chiave, Cronologia, Scheda tecnica, Racconto a scorrimento, Striscia scorrevole, Nuvola di loghi.
• Prezzi: Piani tariffari (schede delle formule, con all’occorrenza un Prezzo barrato e una Nota sotto il prezzo) e Listino prezzi (un elenco di prestazioni e prezzi per categoria, come il menu di un ristorante).
• Interagire: Pulsante CTA, Modulo, FAQ, Mappa, Social network, Newsletter, Prenotazione, Commenti / Recensioni.
• Mettere in evidenza: Prodotti del negozio e Articoli del blog.

Il blocco Immagine propone cinque dimensioni: XS (al massimo 150 px, per un logo o un badge), S, M, L e 100%.

Gli articoli del blog e della documentazione offrono gli stessi blocchi delle pagine, con gli stessi gesti. Solo il blocco Commenti / Recensioni non è proposto nella documentazione.

I link dell’Hero e del Team

In un blocco Hero, fai clic sul blocco: il pannello a destra imposta il testo e la destinazione di ogni pulsante, con il solito selettore di link (una pagina, una sezione, un indirizzo e-mail, un altro sito…).

In un blocco Team, ogni membro ha il campo Pagina del membro: la foto e il nome portano allora alla sua pagina, a una sezione o a un altro sito.

La griglia di schede

Clicca su un blocco Griglia di schede: il pannello di destra elenca le sue schede. Apri una scheda per modificarne titolo, testo, meta, prezzo e testo del pulsante; così anche una scheda aggiunta può avere un pulsante. Il campo Link della scheda sceglie dove porta. Puoi anche cliccare sul testo di una scheda, direttamente nella pagina.

Il link di una scheda si sceglie come gli altri link di TOWeb: una pagina del sito, un articolo, un prodotto, un file o un indirizzo esterno. L’impostazione Allineamento del testo centra il testo delle schede.

Quando ci sono meno schede che colonne, un’indicazione sotto Colonne ti dice quante schede aggiungere per riempire la fila.

Modificare, spostare, eliminare

Fai clic su un blocco: le sue impostazioni compaiono nella scheda Blocco del pannello di destra. La maniglia a sinistra del blocco si trascina per spostarlo; un clic su di essa apre il menu Sposta su, Sposta giù, Duplica, Elimina.

L'indice di una pagina

Il blocco Indice elenca i titoli di una pagina, di un articolo del blog o di un articolo della documentazione, con un link a ciascuno. Digita / e poi «indice» o «sommario», oppure aggiungilo dalla scheda Aggiungi.

Si crea da solo a partire dai titoli che lo seguono: imposta Titoli elencati su H2 e H3 o Solo H2. Si aggiorna a ogni pubblicazione e appare nella lingua di ogni pagina, con gli stessi link in tutte le lingue. Se lasci vuoto il suo Titolo, diventa «Indice», tradotto anch'esso. Sullo smartphone resta chiuso finché non lo tocchi.

Nell'editor, la sua scheda mostra i titoli attuali. Finché nessun titolo lo segue, resta vuoto e non appare sul sito.

Il modulo di contatto

Digita / e scegli Modulo. Fai clic sul blocco: le sue impostazioni compaiono nella scheda Blocco del pannello di destra.

• Campi: aggiungili uno alla volta (testo, e-mail, telefono, area di testo, elenco a discesa, scelta singola, casella di controllo, data, file) e indica se sono obbligatori.
• Testo del pulsante: ciò che mostra il pulsante di invio.
• Dopo l'invio: Mostra un messaggio (il Messaggio di conferma compare al posto del modulo) o Vai a una pagina: una volta inviato il messaggio, il visitatore arriva sulla pagina scelta, nella sua lingua.

I messaggi arrivano all’indirizzo di ricezione dei moduli, impostato una volta per tutto il sito in Configurazione › i-Services.

Incorporare un servizio esterno

Una webcam, un calendario online, un widget di recensioni, le previsioni meteo, un modulo di un altro servizio: il blocco Incorpora li colloca in qualsiasi punto delle tue pagine.

1. Su una riga vuota, digita / e poi Incorpora.
2. Nel pannello a destra, scegli cosa incorporare: Un indirizzo (la pagina del servizio, mostrata in un riquadro di cui imposti l’altezza) o Un codice HTML (il codice che il servizio ti fornisce, da copiare e incollare così com’è).
3. Descrivi in poche parole Cosa mostra l’incorporamento: è ciò che leggono gli screen reader.
4. Apri l’Anteprima per vedere il risultato: nell’editor, il blocco appare come una scheda.

In modalità Un codice HTML, il codice si scrive direttamente nel blocco, a colori, e la scheda Anteprima mostra il risultato.

Se il servizio deposita cookie o traccia i tuoi visitatori, scegli la sua categoria in Consenso del visitatore: Misurazione del pubblico o Marketing e social network. Il blocco attende allora che il visitatore accetti questa categoria nel banner dei cookie; fino ad allora, un messaggio ne tiene il posto, con un link per gestire i cookie. Funziona sia con il banner di TOWeb sia con quello di WebLegal.

Il codice può contenere anche PHP, come una pagina .php di TOWeb 14: la pagina che lo contiene viene pubblicata come index.php, allo stesso indirizzo. Prima della pubblicazione, TOWeb verifica la sintassi del codice: un errore interrompe la pubblicazione indicando la pagina e la riga. Il codice viene eseguito sul tuo hosting, sotto la tua responsabilità, e nel test locale; nell'anteprima, un riquadro ne tiene il posto. Non viene pubblicato in una pagina protetta da password. Per verificare che il tuo hosting esegua PHP, usa Pubblica › Verifica il server.

Copiare o duplicare un passaggio

Un titolo, il suo testo e un’immagine si copiano insieme, come in un programma di videoscrittura:

1. Seleziona il passaggio con il mouse, dall’inizio del titolo alla fine dell’ultimo elemento. Puoi anche fare clic all’inizio, poi Maiusc + clic alla fine.
2. Copia: ⌘C (Mac) o Ctrl+C (Windows).
3. Fai clic alla fine della riga dopo la quale mettere la copia, poi premi Invio: si crea una riga vuota.
4. Incolla: ⌘V (Mac) o Ctrl+V (Windows).

Per riprodurre un’intera sezione, con il suo sfondo e tutto il suo contenuto, usa invece Duplica nei suoi comandi: vedi l’articolo Le sezioni.