Questo componente tema inserisce pulsanti sulla barra degli strumenti del compositore per allineare le immagini caricate a sinistra o a destra del testo, al centro del post, o per allineare più immagini in una griglia, utilizzando i tag di griglia appena implementati. La griglia ridimensionerà automaticamente le immagini per adattarle a seconda di quante sono e delle loro dimensioni, e collegherà anche alle versioni caricate più grandi. I pulsanti / le funzioni di allineamento possono essere utilizzati più volte in un singolo post per creare una varietà di layout. Funziona sia per le visualizzazioni desktop che mobile.
Per usarlo, è sufficiente fare clic sul pulsante di allineamento dell’immagine necessario, quindi caricare le immagini nello spazio designato tra i tag risultanti (contrassegnato da testo segnaposto che può essere modificato nelle impostazioni del componente).
Si noti che la parte della griglia di questo componente serve per allineare le immagini caricate, non i link alle immagini (le altre opzioni di allineamento funzioneranno per le immagini linkate).
Screenshot
pulsante griglia barra strumenti compositore (con esempio di codice griglia)
intendi il composer / editor con la barra degli strumenti? quello sarebbe il primo screenshot con l’esempio della griglia. aggiungerò alcuni screenshot dell’editor con gli altri codici di allineamento attorno alle immagini.
Prego. Come fai a far apparire il testo in grassetto, ad esempio, con “Allinea a sinistra” nelle tue schermate? Ho provato markdown e mostra il codice markdown.
Vedo che funziona con ### ma il grassetto standard con
Da questo codice. Come posso far sì che le informazioni rimangano accanto a ogni immagine? Le informazioni di Shawn dovrebbero essere accanto alla seconda immagine.
inserisci solo alcuni tag HTML <br><br> tra il primo blocco di testo e il tag <div>-data-theme... finché non si spaziano correttamente. Cercherò di programmare un ritorno a capo o qualcosa di simile quando avrò tempo.
Penso che questo non sia un metodo affidabile poiché l’altezza del contenuto differirà dalle dimensioni di una finestra all’altra.
Cancellare i float quando ci sono contenuti arbitrari accanto ad essi è complicato. Non sono sicuro che ci sia una soluzione ovvia qui…[1]
È stato anche un problema con l’editor di Wordpress per secoli.
Le persone tendono a fare affidamento su metodi hacky utilizzando elementi il cui unico scopo è avere un clear: both; per resettare i float precedenti.
Sì, non mi piace nemmeno quel metodo. Stavo pensando di provare una soluzione con la proprietà white-space. alla fine, funziona meglio se le immagini allineate sono post separati. Sfortunatamente, anche le immagini nelle tabelle non funzionano benissimo.
Nonostante abbia provato quelle soluzioni per la proprietà flex align, non sono riuscito a trovare qualcosa di utilizzabile in modo coerente. Ho trovato una soluzione alternativa utilizzabile, tuttavia. Se rendi ogni sezione immagine-testo una citazione in blocco, le separa (ma include la formattazione della citazione per il testo):
alla fine, funziona meglio se le immagini allineate sono post separati. Sfortunatamente, anche le immagini nelle tabelle non funzionano benissimo.
.
