Come aggiungere più colonne su WordPress senza utilizzare un plugin

Vuoi aggiungere contenuti multi-colonna ai tuoi post di WordPress?

Le colonne possono essere utilizzate per creare Layout accattivanti per le tue pubblicazioni e pagine.

I supporti di stampa tradizionali, come giornali e riviste, hanno utilizzato un layout a più colonne sin dai primi giorni di stampa. Il loro scopo era abilitare utenti più facile da leggere un testo più piccolo mentre si utilizza lo spazio disponibile economicamente.

Se non hai ancora creato un sito web o un blog su WordPress, ti invitiamo a consultare Come installare un blog Wordpress passi 7 poi, Come trovare, installare e attivare un tema WordPress sul tuo blog

I layout a colonna singola sono più comunemente usati sul Web. comunque, il griglie con più colonne sono comunque utili per evidenziare i contenuti e facilitarne la lettura e l'analisi.

In questo tutorial, ti mostreremo come aggiungere facilmente contenuti multi-colonna ai tuoi post di WordPress senza scrivere alcun codice HTML.

Aggiunta di contenuto a più colonne in WordPress: la soluzione facile

La creazione di contenuto multi-colonna, noto anche come contenuto della griglia in WordPress, ora è facile perché è una funzionalità predefinita. Il nuovo editor di blocchi Gutenberg di WordPress propone un blocco di colonne.

Per aggiungere un layout a più colonne, è necessario creare un nuovo articolo o modificarne uno. Una volta nell'area di modifica, fai clic sul pulsante " aggiungere Nella parte superiore per aggiungere un blocco.

Quindi devi selezionare il blocco Colonne "Situato nella scheda" Elementi del layout ".

Vedrai il puntatore del mouse saltare nella colonna di sinistra e un segnaposto per il testo apparirà nella colonna di destra.

Come puoi vedere nello screenshot qui sopra, il blocco Colonna all'inizio sembra essere un'area vuota. Se passi il mouse a sinistra, puoi vedere il bordo del blocco evidenziato.

Potrai anche vedere i parametri del blocco nella colonna di destra dello schermo.

Per impostazione predefinita, il blocco di colonne aggiunge due colonne. Puoi aumentare il numero di colonne che desideri aggiungere dalle impostazioni del blocco a destra. Ciò consente di aggiungere fino a sei colonne su una singola riga.

Basta fare clic su una colonna e iniziare a digitare per aggiungere contenuti. Puoi utilizzare il tasto Tab sulla tastiera per passare alla colonna successiva.

Aggiunta di contenuti multimediali e altri contenuti alle tue colonne

Oltre al contenuto di testo, puoi anche aggiungere immagini e incorporare video nelle colonne di WordPress.

Il blocco di colonne consente di aggiungere blocchi all'interno di ogni colonna. Passa il mouse su una colonna e noterai il "Aggiungi un nuovo blocco"Dentro. Puoi anche aggiungere un blocco inserendo il nome del blocco.

Il blocco selezionato verrà visualizzato nella colonna. Puoi andare lì e aggiungere contenuti.

Per caricare - caricare - i tuoi media, scopri il nostro articolo su Come caricare i tuoi media di massa su WordPress

Ecco come potrebbe apparire la tua nuova colonna nel tema WordPress predefinito Ventinove. In questo esempio, utilizziamo tre colonne e l'ultima colonna contiene un'immagine.

Se vuoi solo aggiungere un'immagine e del testo a lato, puoi anche usare il blocco Media e testo Invece di colonne. Questo blocco è progettato specificamente per visualizzare file multimediali come immagini e video accanto al testo.

Aggiunta di più colonne nell'editor classico di WordPress

Se non hai aggiornato WordPress a Gutenberg e stai ancora utilizzando ileditor classicoè necessario installare un plug-in separato per creare un layout di griglia di colonne.

Inizia installando e attivando il plugin Colonne a griglia leggera. 

Per istruzioni dettagliate, segui la nostra guida passo passo su come per installare un plugin in WordPress.

Dopo l'attivazione, è possibile creare un nuovo messaggio o aprire un vecchio messaggio da modificare. Quindi fare clic su " Aggiungi colonne Nella barra degli strumenti dell'editor visivo.

Ora vedrai una finestra popup che ti consente di aggiungere la tua prima colonna. Puoi scegliere quanta area può coprire la tua colonna, su desktop, tablet e dispositivi mobili in modo diverso.

Vai oltre scoprendo Come creare una larghezza pagina intera su WordPress

Ad esempio, se si imposta la percentuale di griglia del desktop 50%, la colonna coprirà metà della linea.

Ha molte opzioni per impostare la larghezza della colonna, da 5% a 100% con un intervallo 5. Puoi sceglierne uno facendo clic sul menu a discesa.

Quindi, è necessario aggiungere il contenuto della colonna nell'area "Contenuto", quindi fare clic sul pulsante "OK" per inserirlo nella pubblicazione.

Il plugin genererà lo shortcode richiesto con il tuo contenuto e lo aggiungerà al tuo editor di post.

Scopri in questo tutorial Come installare e configurare il plugin WP Super Cache per migliorare le prestazioni del tuo blog.

Ora che la tua prima colonna è stata aggiunta, puoi ripetere il processo per aggiungere altre colonne. Per l'ultima colonna, non dimenticare di selezionare la casella "Ultima colonna della riga'.

Successivamente, sarai in grado di salvare l'anteprima e visualizzarla in anteprima. Ecco come appare sul nostro sito Web di test Twenty Seventeen.

Se vuoi anche trovare temi WordPress che possano aiutarti a creare colonne sulle tue pagine o pubblicazioni, ecco i temi 3 WordPress premio perfetto per questo compito.

1. TheGem

Esistono molti temi WordPress che possono pretendere di offrire un layout OnePage, ma nessuno può offrire la vasta gamma di opzioni e funzionalità disponibili nel modello WordPress TheGem. 

Tutti gli elementi di design associati a un buon sito Web OnePage sono presenti in questo tema WordPress: un dispositivo di scorrimento a schermo intero (che può essere creato con il plug-in Revolution Slider fornito con il tema WordPress), una scelta di sei stili di intestazione e la possibilità di creare sezioni a larghezza intera usando il plug-in Visual Composer incluso nel pacchetto.

Inoltre, ha una serie di opzioni di personalizzazione per elementi come caratteri, colori e icone. È una cosa rara, ma ci sono anche dettagli che non ci piacciono su TheGem. Ma fondamentalmente è un tema WordPress adatto a te ovviamente, dato il numero di punti positivi che ha. È un forte concorrente, che faciliterebbe la creazione di un sito Web OnePage.

Download | Demo | Web hosting

2. Stoccolma

Stoccolma è un tema WordPress progettato per aiutarti a creare il sito Web per una società di costruzioni, ingegneria civile o qualsiasi azienda legata al mondo della ristrutturazione edilizia. Questo modello WordPress è rivolto a professionisti che si preoccupano della qualità e dei dettagli.

Viene fornito con un pannello delle opzioni e un backend user-friendly, ti permetteranno di gestire facilmente i tuoi contenuti. Ci sono circa 20 demo di questo modello che presentano una vasta gamma di attività su cui è possibile utilizzare questo tema WordPress. E questi possono anche essere usati come base per la personalizzazione futura in modo che il tuo sito web abbia un aspetto unico.

Molto reattivo, viene visualizzato perfettamente su qualsiasi tipo di schermo. Se durante la personalizzazione o l'installazione di questo modello si riscontrano difficoltà, la documentazione completa inclusa nel pacchetto può fungere da guida. E se ancora non riesci, il supporto dedicato a questo tema WordPress rimane a tua disposizione.

Download | Demo | Web hosting

3. Giove

Giove è un altro tema WordPress molto popolare. Ha demo 25 che coprono 6 dalle nostre categorie - agenzia, creatività, istruzione, cibo, salute ed eCommerce - e altri verranno aggiunti ad esso in futuri aggiornamenti. La maggior parte dei suoi layout ha un design minimalista, con una piacevole tipografia.

Uno dei principali punti di forza di Giove è il Personalizzatore di intestazioni creative che ti consente di personalizzare rapidamente e facilmente il design delle intestazioni del tuo sito web. Visual Composer, cursori 3 (Layer, Revolution e iCarousel), nuovi codici brevi 10, più di icone 1800 e tipi di post personalizzati 10 sono tutti inclusi nella consegna.

Anche il tempo di caricamento della pagina è eccellente. Questo è un ottimo prodotto e sarà difficile trovare tanti temi WordPress con le sue caratteristiche.

Download | Demo | Web hosting

Altre risorse consigliate

Per andare oltre nell'ottimizzazione del tuo blog o del tuo sito web, ti suggeriamo anche di consultare alcuni link che ti immergeranno nel mondo di Gutenberg

• Come preparare il tuo sito web per Gutenberg 
• Come faccio a sapere se il tuo plugin è compatibile con Gutenberg?
• Gutenberg migliorerà o rompere WordPress?

Conclusione

Ecco ! Questo è tutto per questo tutorial. Speriamo che questo articolo ti abbia aiutato a imparare come aggiungere colonne ai tuoi post e pagine WordPress. Non esitate a condividi questo tutorial con i tuoi amici sui tuoi social network.

Se hai suggerimenti o commenti, saranno i benvenuti. Ma se sei un principiante, ti invitiamo a consultare il nostro risorse.

...