Come allineare le immagini Side-by-Side in WordPress
L’allineamento delle immagini è una lotta costante per il blogger WordPress.
Questo post è per tutti coloro che hanno trascorso più tempo di quanto avrebbero cura di ammettere giocherellare con l’allineamento delle immagini e il posizionamento nell’editor.
I due metodi migliori per allineare le immagini
Ci sono due tecniche che dovresti considerare per posizionare le immagini l’una accanto all’altra. Io condividere come utilizzare ciascuno di essi, così come i pro ei contro inclusi.
Allinea le immagini con una galleria
Il metodo più affidabile per posizionare le immagini fianco a fianco è quello di utilizzare una galleria WordPress.
Se non hai mai creato una galleria prima, segui questo tutorial su come creare gallerie.
Il trucco consiste nell’utilizzare una versione di medie dimensioni delle immagini e scegliere due colonne, anche se si includono solo due immagini. Il risultato sarà simile a questo:
A differenza delle immagini che inserisci nel tuo post, le gallerie hanno un HTML speciale che mantiene le immagini l’una accanto all’altra. Questa struttura rende più semplice e meno complicato allineare le immagini in righe / colonne.
Posiziona le immagini con i codici brevi delle colonne
Se non ti dispiace aggiungere un nuovo plugin al tuo sito, i codici brevi delle colonne sono un’ottima soluzione per allineare le immagini.
Colonna Shortcodes è uno di quei plugin impressionante che non riempie il tuo sito con nuovi menu. In effetti, l’unica cosa che aggiunge alla tua dashboard di amministrazione è questo comodo pulsante sopra l’editor.
Per mostrare come funziona, creerò una singola riga di tre immagini.
Come utilizzare i codici brevi delle colonne
Il primo passo è posizionare il cursore su una riga vuota nell’editor. Quindi fare clic sul pulsante shortcode e selezionare un’opzione di colonna.
Ripetere questo passaggio per aggiungere una seconda colonna 1/3 e quindi ripetere ancora una volta, ma questa volta utilizzando l’opzione di un terzo (ultimo). Il risultato sono i seguenti codici brevi aggiunti all’editor.
Se non hai mai usato shortcodes prima, si consiglia di seguire questo tutorial prima.
Come puoi vedere, ogni shortcode ha un tag di apertura e chiusura. Ora puoi inserire un’immagine all’interno di ogni shortcode, in questo modo:
Sembra un disastro, non è vero?
Questo perché i codici brevi non possono modellare le immagini nell’editor, ma non è un problema. Una volta visualizzati sul sito, si allineeranno ordinatamente in colonne, come questa:
Colonna di codici brevi rispetto alle gallerie
Mentre i codici brevi non visualizzare bene l’editor come gallerie, e può essere più di una sfida, è anche ottenere un po ‘ più di controllo. Ad esempio, le gallerie costringono tutte le immagini a collegarsi:
- File multimediale
- Pagina allegati
- Niente
Con il plugin colonne, le immagini possono avere URL personalizzati e ogni collegamento a un diverso tipo di pagina.
Puoi anche combinare le colonne. Ad esempio, è possibile inserire un’immagine in un shortcode 2/3 accanto a un’immagine con un shortcode 1/3 colonna.
Perché non dovresti usare le opzioni di allineamento
Questi metodi produrranno i layout desiderati senza tutti i mal di testa.
Le gallerie di WordPress sono il modo più semplice e semplice per allineare le immagini in una riga. Tuttavia, Shortcodes colonna è una buona alternativa che fornisce una maggiore flessibilità.
Entrambi funzionano così bene perché inseriscono le immagini in una nuova struttura HTML. L’HTML consente di mantenere un layout side-by-side, indipendentemente dallo schermo utilizzato per visualizzarli.
C’è qualcosa che ho perso? Hai domande? Pubblica un commento qui sotto.
Leave a Reply