Hai mai notato come alcuni siti web abbiano contenuti perfettamente spaziati e facili da scansionare, mentre altri sembrano affollati e difficili da leggere?
Il segreto spesso si riduce a qualcosa di semplice: interruzioni di riga e spaziatura corrette.
Se hai mai aggiunto interruzioni di riga nel tuo editor di WordPress solo per scoprire che non vengono visualizzate sulla tua pagina pubblicata, non sei assolutamente solo. WordPress gestisce la spaziatura in modo leggermente diverso rispetto ai word processor come Google Docs o Microsoft Word.
Una volta che capisci come funziona, però, avrai il controllo completo sull'aspetto dei tuoi contenuti.
Ti mostreremo diversi metodi affidabili per aggiungere interruzioni di riga in WordPress, dalle scorciatoie rapide alle opzioni di formattazione più avanzate.
Perché aggiungere un'interruzione di riga in WordPress (spaziatura tra nuove righe)?
A prima vista, un'interruzione di riga potrebbe sembrare una piccola scelta di formattazione, ma può avere un grande impatto sulle prestazioni dei tuoi contenuti.
Dal miglioramento della leggibilità al potenziamento dell'esperienza utente, l'aggiunta di una spaziatura corretta rende le tue pagine pulite e professionali. Ecco perché è importante:
- Migliore leggibilità: Interrompe blocchi di testo per una scansione più facile.
- Ottimizzato per dispositivi mobili: Mantiene i contenuti chiari su schermi più piccoli.
- Corregge il testo incollato: Pulisce la formattazione da altre fonti.
- Attira l'attenzione: Aiuta i suggerimenti e le CTA a risaltare.
In breve, le interruzioni di riga rendono il tuo contenuto più facile da leggere e più coinvolgente, sia per i visitatori che per i motori di ricerca.
Nota: Prima di iniziare, è importante sapere che lo spazio tra le righe è controllato dal tema WordPress che utilizzi.
Ti mostreremo come aggiungere spazio tra i blocchi nell'editor a blocchi, e poi come regolare lo spazio tra le righe nel tuo tema se non sei soddisfatto dei risultati predefiniti.
Detto questo, diamo un'occhiata a come aggiungere facilmente un'interruzione di riga in WordPress.
- Come aggiungere uno spazio tra doppie righe tra i blocchi
- Come aggiungere uno spazio tra righe singole
- Il modo più semplice: usare il blocco Spaziatore
- Modifying the Line Height and Spacing
- Tutorial video
Come aggiungere uno spazio tra doppie righe tra i blocchi
Quando premi il tasto Invio per Windows o il tasto Return per Mac sulla tastiera per aggiungere un'interruzione di riga, WordPress lo considera un nuovo paragrafo.
Ciò significa che aggiungerà automaticamente uno spazio di doppia riga. La quantità di spaziatura è controllata dal tuo tema e questo stile è una funzionalità standard in tutti i buoni temi WordPress.
Vai semplicemente all'editor di contenuti, premi il tasto Invio o Return dopo la riga, e poi digita qualcos'altro nella riga successiva.
Semplicemente facendo ciò, in base allo stile del tuo tema, dovresti vedere una chiara distinzione tra i paragrafi.
Come aggiungere uno spazio tra righe singole
Ora, se stai scrivendo qualcosa come un indirizzo, allora probabilmente vuoi che sia a spaziatura singola invece che a spaziatura doppia sul tuo sito WordPress.
In questo caso, è necessario premere il tasto SHIFT + INVIO su Windows o il tasto SHIFT + RETURN su Mac.
Questo dice a WordPress che vuoi iniziare una nuova riga all'interno dello stesso paragrafo. Questa azione crea una singola interruzione di riga invece del doppio spazio utilizzato per un nuovo paragrafo.
Il modo più semplice: usare il blocco Spaziatore
Per un modo semplice e senza codice per aggiungere spazio extra tra due blocchi qualsiasi, il metodo più semplice è utilizzare il blocco Spaziatore integrato.
Fai semplicemente clic sul pulsante 'Aggiungi blocco' nell'editor per aggiungere un nuovo blocco e cerca 'Spaziatore'. Una volta aggiunto, apparirà un nuovo spazio vuoto sulla tua pagina.
Puoi quindi fare clic sullo spaziatore e trascinare la maniglia blu su o giù per regolarne l'altezza.
Questo ti dà un controllo preciso sulla spaziatura verticale direttamente nell'editor.
Modifica dell'altezza e dello spazio tra le righe
A volte, anche quando aggiungi la spaziatura corretta nell'editor, non viene visualizzata come desideri nel tuo tema.
Ci sono due modi per risolvere il problema:
- Utilizzo di un plugin (il modo più semplice)
- Manualmente con codice CSS (più avanzato)
Diamo un'occhiata prima al metodo più semplice.
Aggiungere spaziatura tra le righe utilizzando un plugin
Se desideri apportare modifiche stilistiche al tuo tema senza dover imparare a programmare, l'utilizzo di un plugin come CSS Hero è il modo migliore per farlo.
CSS Hero rende facile cambiare il design del tuo sito WordPress senza conoscere alcun codice.
Puoi vedere maggiori dettagli nella nostra recensione completa di CSS Hero.
Se desideri apportare modifiche più importanti al tuo tema, come spostare una barra laterale o aggiungere un piè di pagina, allora un plugin per page builder drag-and-drop sarebbe un'opzione migliore. Un plugin per page builder ti permetterebbe anche di apportare piccole modifiche come cambiare i colori dei font o aggiungere interruzioni di riga in WordPress.
Non vuoi usare un plugin, o hai solo bisogno di apportare questa singola modifica? Allora, l'opzione del codice CSS manuale potrebbe essere la migliore per te.
Modificare la spaziatura dei paragrafi manualmente con codice CSS
Per aggiungere interruzioni di riga manualmente senza un plugin, devi aggiungere del CSS al tuo tema.
Il CSS è fondamentalmente come la funzione di formattazione in Microsoft Word. Invece di fare clic sui pulsanti, scriverai del semplice codice CSS. Non è così spaventoso come alcuni principianti potrebbero pensare. Il CSS è molto facile da capire se segui le istruzioni.
Per aggiungere CSS personalizzato al tuo tema, devi visitare la pagina Aspetto » Personalizza. Questo avvierà il personalizzatore del tema di WordPress, dove dovrai fare clic sulla scheda 'CSS aggiuntivo' dalla colonna di sinistra.
Se non vedi queste opzioni di menu, potresti utilizzare un tema a blocchi. Si prega di consultare il nostro articolo su come correggere il personalizzatore del tema mancante nell'amministrazione di WordPress.
Nella casella CSS personalizzato, devi aggiungere il seguente codice CSS:
Questo codice si rivolge a tutti gli elementi di paragrafo (p) specificamente all'interno dell'area di contenuto principale dei tuoi post, che WordPress spesso identifica con la classe .post. Ciò garantisce che influenzi solo i tuoi articoli.
.post p{line-height: 1.5em;}La regola CSS mostrata sopra cambierà l'interlinea del contenuto dei paragrafi a 1,5em. Em è un'unità di larghezza per la tipografia.
Ora, questo cambia solo lo spaziatura di singola interlinea.
Se vuoi cambiare la spaziatura dei paragrafi in WordPress (cioè, doppia interlinea), dovrai aggiungere del padding.
.post p {
line-height: 1.5em;
padding-bottom: 15px;
}
Sentiti libero di regolare i numeri in questo codice CSS. La modifica del valore padding-bottom cambierà lo spazio tra i tuoi paragrafi.
Puoi anche aggiungere CSS personalizzato al tuo sito utilizzando il plugin WPCode. Il plugin rende molto facile inserire e gestire il codice sul tuo sito.
Per maggiori dettagli, consulta la nostra guida su come aggiungere CSS personalizzato al tuo sito WordPress.
Se non ti piace leggere le istruzioni, guarda il nostro video tutorial.
Tutorial video
Per una guida visiva, puoi guardare il nostro video tutorial qui sotto. Copre tutti i metodi che abbiamo discusso per aggiungere spaziatura di riga singola e doppia nel tuo contenuto.
Speriamo che questo articolo ti abbia aiutato ad aggiungere un'interruzione di riga in WordPress. Potresti anche voler consultare la nostra guida su come usare i pattern di blocchi di WordPress e il nostro elenco dei migliori temi WordPress compatibili con Gutenberg.
Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.
Ralph
Questo era un grosso problema nel vecchio creator. Non sapevo mai come sarebbe apparso e dovevo premere anteprima ogni poche righe, ma penso che con Gutenberg sia molto più facile e ho imparato a usare semplicemente shift+invio. Lo faccio automaticamente e quasi senza coscienza. Non so perché, ma alcuni siti web non consentono shift+invio, solo invio o niente, e allora penso "PERCHÉ non funziona"!
Deepak Sahani
Ottimo video e post hanno risolto la mia domanda.
Supporto WPBeginner
Glad our guide could be helpful!
Amministratore
Jennyfer
Grazie mille per queste informazioni! Molto utile. Proprio quello che stavo cercando.
Supporto WPBeginner
Glad our guide was helpful
Amministratore
Colleen Cochran
Alla fine ho capito la cosa di shift-invio per le righe a spazio singolo nella poesia, ma quando il post viene pubblicato e inviato via email ai follower, perde la formattazione e tutte le righe si uniscono. Come posso risolvere?
Supporto WPBeginner
Dovresti verificare con lo strumento utilizzato per inviare la notifica per lo stile per risolvere questo problema.
Amministratore
Luiz
Grazie! Molto utile!
Supporto WPBeginner
You’re welcome
Amministratore
Robin
Molto utile! Grazie!!
Supporto WPBeginner
You’re welcome
Amministratore
Dhirendra
C'è un'opzione per ridurre lo spazio tra le immagini...
Supporto WPBeginner
Dipenderebbe dall'immagine specifica, ma come punto di partenza per trovare cosa causa lo spazio, dovresti dare un'occhiata alla nostra guida qui sotto:
https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
Amministratore
jan van den hoed
Grazie per la spiegazione. Una domanda però. Come posso fare la stessa cosa su uno smartphone. Sto modificando il mio blog in viaggio e non ho un laptop disponibile. Ho provato a fare shift invio ma non ha funzionato
Supporto WPBeginner
A causa delle limitazioni dei dispositivi mobili, probabilmente dovrai utilizzare il metodo CSS.
Amministratore
Val
Grazie mille, è stato di grande aiuto. Mi sono tormentato per lo spazio!
Supporto WPBeginner
Glad our guide was helpful
Amministratore
Stephen
Grazie, ha aiutato molto.
Supporto WPBeginner
Glad our article was helpful
Amministratore
Douglas Daniel
Per cambiare il CSS mi dice che devo acquistare un piano premium. Sono senza speranza?
Supporto WPBeginner
Sembra che tu sia su WordPress.com e questo tutorial sia per siti WordPress.org:
https://www.wpbeginner.com/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
saresti purtroppo limitato alle altre opzioni come shift+invio per spaziare il contenuto su una singola riga.
Amministratore
SOO
Grazie! Utile!!
Supporto WPBeginner
You’re welcome, glad our article could help
Amministratore
Rebecca
Non ha funzionato per me. Ci sono motivi per cui non dovrebbe funzionare?
Supporto WPBeginner
Se stai usando un plugin page builder, potrebbero avere un metodo diverso per la spaziatura singola/doppia. Altrimenti, potrebbe essere un conflitto di plugin/tema per cui dovresti disabilitare i tuoi plugin e/o cambiare il tuo tema per verificare
Amministratore
Tim G
Vorrei ridurre lo spazio tra le normali righe di paragrafo — IMHO, c'è troppo spazio bianco di default. Vorrei anche aggiungere mezza riga alla fine di un paragrafo, piuttosto che una riga intera: Wordpress di default sembra fare solo l'equivalente di un doppio ritorno a capo, che è piuttosto del ventesimo secolo e non emula ciò che Word può fare. Qualche idea?
Supporto WPBeginner
You would want to reach out to the support for your specific theme and they should be able to tell you what CSS needs to be added to reduce your line spacing
Amministratore
sofar ahmad
TQ tantissimo
molto utile
Supporto WPBeginner
Glad our guide could be helpful
Amministratore
Sumeet
grazie era quello che stavo cercando, mi è stato d'aiuto…
Supporto WPBeginner
Glad our article helped
Amministratore
Jen
Dio ti benedica! Sono così grata che tu abbia pubblicato questo con il CSS! Chi l'avrebbe mai detto che bastasse questo per cambiare lo spazio! Cercavo qualcosa del genere da molto tempo! Grazie mille!
Supporto WPBeginner
Glad our article could help you
Amministratore
Kathy
Sto usando il metodo "shift" enter ma non mi permette di avere font di dimensioni diverse quando lo faccio. C'è una soluzione?
Supporto WPBeginner
Ciao Kathy,
Si prega di consultare la nostra guida su come cambiare le dimensioni dei font in WordPress.
Amministratore
Lora Staples
Ottimo video. Mi è piaciuto il contenuto, il ritmo e il tono dell'oratore. GRAZIE!
Kunal Khandelwal
Thank you so much for this suggestion. Didn’t know it was so easy