Editor Studio: personalizzare una griglia di sezione
Tempo di lettura: 5 min.
Nell'Editor Studio, le sezioni sono dotati di una griglia integrata contenente una singola cella (che ospita l'intera sezione). Dividi la sezione in più celle per dare una struttura responsiva al contenuto. Ci sono vari layout personalizzabili tra cui scegliere.
In questo articolo, scoprirai come:
Vuoi aggiungere celle a un contenitore?
Puoi applicare una griglia CSS avanzata sul contenitore.
Aggiungere celle a una sezione
Aggiungi le celle a una sezione per creare un layout responsivo e strutturato. Mantenere gli elementi in celle separate garantisce che rimangano al loro posto su tutti gli schermi. Scegli un layout, quindi sposta gli elementi nelle celle: puoi sempre dividere le celle o aggiungerne di nuove in un secondo momento.
Per aggiungere celle a una sezione:
- Seleziona la sezione pertinente nell'Editor
- Clicca sul menu a tendina Vuoto nella parte superiore della sezione
- Scegli un layout: Righe, Colonne, Collage, ecc.
Suggerimento: puoi modificare il layout dal menu a tendina in qualsiasi momento: gli elementi non verranno spostati - (Facoltativo) Trascina gli elementi nelle celle pertinenti
Scambiare le celle nella griglia
Riorganizza la griglia delle sezioni in modo rapido ed efficiente scambiando le celle. Usando il trascinamento, puoi scambiare istantaneamente le 2 celle: prendono istantaneamente l'una il posto dell'altra sulla griglia.
Per scambiare le celle:
- Seleziona la sezione pertinente nell'Editor
- Seleziona la prima cella
- Tieni premuta l'icona di trascinamento nella parte superiore della cella mentre la trascini sull'altra cella
Suggerimento: quando vedi l'indicazione Scambia contenuto, significa che puoi rilasciare la cella
Personalizzare la griglia di sezione
Rendi le celle e la griglia esattamente come desideri. Puoi dividere o unire le celle esistenti, aggiungerne di nuove e trascinare le linee della griglia per regolarne le dimensioni. Puoi anche aggiungere spazi vuoti per creare uno spazio tra le celle.
Per personalizzare la griglia di sezione:
- Seleziona la sezione pertinente nell'Editor
- Scegli come vuoi personalizzare la griglia:
Dividere una cella esistente
Aggiungere una nuova cella
Unire le celle
Ridimensionare una cella
Aggiungere spazi tra le celle
Eliminare una cella
Nota:
Al momento, non è possibile duplicare una cella.
Passare a una griglia CSS avanzata
Passare a una griglia CSS avanzata offre un controllo più preciso del layout per punto di interruzione. Puoi scegliere il numero di righe e colonne che desideri e impostarne le dimensioni utilizzando misurazioni responsive (es. min/max, %).
Per passare dalla griglia di sezione a una griglia CSS:
- Seleziona la sezione pertinente nell'Editor
- Clicca sulla freccia Apri Ispezione in alto a destra dell'Editor
- Scorri verso il basso fino a Layout
- Clicca su Cambia accanto a Griglia CSS avanzata
- Clicca su Passa a griglia CSS
Hai trovato utile questo articolo?
|