Panoramica dell'elemento di testo ricco - Aiuto Webflow
Usa un elemento di testo ricco (RTE) per creare contenuti lunghi.
Un elemento di testo ricco (RTE) è l'elemento perfetto per creare contenuti lunghi come post di blog, pagine informative, biografie, ecc. Invece di aggiungere singoli elementi di intestazione, paragrafo, elenco o immagine, puoi fare doppio clic su un elemento di testo ricco per creare e formattare testo, codice personalizzato ed elementi multimediali.
Come aggiungere un elemento di testo ricco al tuo sito
Puoi aggiungere un elemento di testo ricco trascinandolo dal pannello Aggiungi (A) alla tela del Designer. Per aggiungere o modificare il contenuto all'interno, fai doppio clic sull'elemento di testo ricco o seleziona l'elemento e premi Invio o Return sulla tastiera.
Puoi aggiungere i seguenti elementi all'interno degli elementi di testo ricco:
- Paragrafi
- Intestazioni (H1-H6)
- Immagini
- Didascalie delle immagini
- Attributi alt delle immagini
- Codice personalizzato
- Citazioni
- Elenchi non ordinati (puntati)
- Elenchi ordinati (numerati)
- Video (YouTube, Vimeo)
- Contenuti multimediali (Google Maps, SoundCloud, Imgur, Giphy, Codepen e altro)
Puoi anche aggiungere formattazione aggiuntiva agli elementi di testo:
- Link (URL, pagina, email, ecc.)
- Testo in grassetto
- Testo in corsivo
- Testo in apice e pedice
- Codice
Comandi slash
Quando modifichi il contenuto all'interno di un RTE, puoi usare i comandi slash per generare rapidamente testo utilizzando l'Assistente AI di Webflow o aggiungere nuovi elementi di contenuto. Per usare i comandi slash, premi / (barra) sulla tastiera e clicca su Genera più testo per aggiungere testo contestualmente rilevante utilizzando l'Assistente AI, seleziona l'elemento desiderato dal menu Aggiungi, o inizia a digitare per filtrare l'elenco degli elementi:
- Intestazione (H1–H6)
- Elenco numerato
- Elenco puntato
- Paragrafo
- Citazione
- Immagine
- Video
- Contenuto ricco
- Incorporamento HTML
- Blocco di codice
Come aggiungere e formattare il contenuto testuale
Puoi iniziare a digitare all'interno dell'RTE e poi aggiungere formattazione al testo per creare titoli, citazioni, testo in grassetto o corsivo, testo in apice o pedice e link.
Generare contenuti testuali usando l'Assistente AI di Webflow
Per aggiungere rapidamente un testo contestualmente rilevante a un RTE usando l'Assistente AI:
- Tasto destro sull'RTE
- Scegli Modifica copia dal menu contestuale
- (Opzionale) Inserisci un prompt che descriva il testo che desideri generare
- Clicca sull'icona "Invia prompt"
- Clicca su Fatto per accettare il testo generato
Scopri di più sull'uso dell'Assistente AI di Webflow per generare e modificare contenuti.
Come aggiungere paragrafi
Come in qualsiasi altro editor di testo, premendo Invio sulla tastiera si creerà un nuovo paragrafo su una nuova riga dove puoi continuare a digitare. Per aggiungere più paragrafi, premi Invio alla fine di un paragrafo. Puoi anche usare l'Assistente AI di Webflow per aggiungere e perfezionare il testo per te.
Come aggiungere titoli e citazioni
Per creare un titolo, seleziona qualsiasi testo all'interno di un paragrafo e scegli un'opzione titolo (H1-H6). Lo stesso vale per creare citazioni.
Come formattare il testo e aggiungere link
Qualsiasi parte di un elemento di testo (ad es., titoli, paragrafi, didascalie, ecc.) può essere formattata con grassetto, corsivo, apice, pedice e link selezionando parte del testo e applicando le opzioni di formattazione desiderate. Scopri di più sulla formattazione del testo inline.
Quando crei un link all'interno di un RTE, hai l'opzione di scegliere un URL, una pagina, una sezione della pagina, un'email o un numero di telefono.
Scorciatoie da tastiera
Queste scorciatoie da tastiera possono aiutarti a formattare rapidamente il contenuto di testo arricchito:
- Inserisci uno spazio non separabile: Shift + Space
- Inserisci un'interruzione di riga: Shift + Enter
- Testo in grassetto: Command + B (Control + B su Windows)
- Testo in corsivo: Command + I (Control + I su Windows)
- Inserisci hyperlink: Command + K (Control + K su Windows)
Durante la modifica nel RTE, puoi utilizzare la scorciatoia del comando slash (“/**”) per aggiungere rapidamente elementi di contenuto. Puoi anche usare le scorciatoie Markdown:
- Testo in corsivo:
*testo*o_testo_ - Testo in grassetto:
**testo**o__testo__ - Grassetto & corsivo:
***testo***o___testo___ - Inserisci hyperlink:
[testo del link](https://www.url.com) - Intestazione 1:
#+ Spazio - Intestazione 2:
##+ Spazio - Intestazione 3:
###+ Spazio - Intestazione 4:
####+ Spazio - Intestazione 5:
#####+ Spazio - Intestazione 6:
######+ Spazio - Citazione:
>+ Spazio - Elenco non ordinato:
-+ Spazio - Elenco ordinato:
1.+ Spazio
Come aggiungere contenuti multimediali, codice personalizzato e elenchi
Quando il cursore del testo è su una nuova riga, appare un pulsante “plus”. Cliccando su questo pulsante si apre un menu di inserimento con opzioni per aggiungere immagini, video, altri media ricchi, codice personalizzato e elenchi puntati o numerati.
Aggiungi immagini, video e media ricchi
Tutti gli elementi multimediali nel RTE sono reattivi e rispetteranno il rapporto d'aspetto del contenuto. Il supporto video per YouTube, Vimeo e Dailymotion è stato migliorato per consentire tempi di inizio personalizzati. Ecco un elenco di alcuni tipi di media ricchi supportati:
- YouTube
- Vimeo
- Post di Instagram
- Post di Facebook
- DailyMotion
- Kickstarter
- TED
- Wistia
- Livestream
- Twitch
- Hulu
- Album di Imgur
- Google maps
- JSFiddle
- Codepen
- Scribd
- SlideShare
- Playlist e classifiche di Spotify
- Giphy
- SoundCloud
- E altro ancora!
Impostazioni dei media
Ogni elemento multimediale può essere dimensionato utilizzando i preset nelle impostazioni dell'immagine o impostato su un valore specifico in pixel o percentuale cliccando sull'icona "chiave inglese" nella barra degli strumenti. È possibile aggiungere anche una didascalia opzionale sotto le immagini.
Testo alternativo
Per aggiungere testo alternativo alle immagini, seleziona l'immagine, clicca sull'icona "chiave inglese", quindi digita il tuo testo alternativo. Scopri di più su come scrivere testo alternativo descrittivo.
Come aggiungere codice personalizzato
Il menu di inserimento include un pulsante per aggiungere codice personalizzato. Puoi utilizzare il codice personalizzato per creare tabelle e divisori con HTML, stilizzare parti del tuo contenuto con CSS, espandere la funzionalità del tuo sito con JavaScript e incorporare contenuti di terze parti.
Passaggi:
- Posiziona il cursore dove desideri aggiungere il codice
- Clicca sull'icona "più" per aprire il menu di inserimento e clicca sul pulsante del codice personalizzato
- Aggiungi il tuo codice
Come aggiungere elenchi
Il menu di inserimento offre opzioni per aggiungere elenchi non ordinati (puntati) e ordinati (numerati). Puoi anche annidare o disannidare gli elenchi.
- Elenco puntato: usa il menu di inserimento o digita un trattino
-seguito da uno spazio. - Elenco numerato: usa il menu di inserimento o digita un numero intero seguito da un punto e uno spazio.
- Annida un elenco: seleziona l'elemento e premi Tab. Disannida: seleziona e premi Shift + Tab.
Come aggiungere contenuti di testo ricco da altre fonti
Puoi incollare testo ricco da altri siti o elaboratori di testi (come Google Docs). La formattazione, i link e le immagini verranno mantenuti se incollati nel campo di testo ricco del Designer o del CMS.
Come riorganizzare ed eliminare elementi
Gli elementi in un elemento di testo avanzato possono essere riorganizzati tramite trascinamento sulla tela o sul Navigatore, o tramite scorciatoie da tastiera. Gli elementi possono essere eliminati selezionandoli e premendo Backspace o Command + X (Control + X su Windows).
Come stilizzare il contenuto RTE
Stilizzare elementi individuali all'interno di un elemento di testo avanzato
Stilizza gli elementi all'interno dell'elemento di testo avanzato come qualsiasi elemento Webflow: seleziona sulla tela, vai al pannello Stile, applica o crea una classe e stila.
Stilizzare elementi all'interno di un elemento di testo avanzato con tag HTML
Gli elementi RTE ereditano stili dai tag HTML. Puoi stilizzare tramite selettori nidificati, limitando gli stili predefiniti agli RTE con la stessa classe.
Passaggi:
- Seleziona RTE sulla tela
- Assegna una classe a RTE
- Seleziona l'elemento in RTE
- Vai al pannello Stile (S)
- Clicca nel campo Selettore
- Seleziona il tag HTML
- Clicca su Nidifica selettore all'interno di “nome classe”
- Stila come desiderato
Come stilizzare il testo avanzato dinamico
Gli elementi di testo avanzato possono collegarsi ai campi di testo avanzato in una Collezione. La stilizzazione è meglio farla scollegando, stilizzando e ricollegando—o applicando una classe, stilizzando e mantenendo collegato. Scopri di più sul testo avanzato dinamico.