Editor Studio: aggiungere e configurare i Flexbox
Tempo di lettura: 2 min.
Usa i flexbox per semplificare la visualizzazione dei contenuti sul tuo sito. I Flexbox sono strumenti di layout costituiti da contenitori responsivi, in modo che si adattino automaticamente alle dimensioni dello schermo dei visitatori.
Passaggio 1 | Aggiungi un flexbox
Apri il pannello Aggiungi per selezionare un preset flexbox e trascinalo sulla tua pagina. Ci sono molti design tra cui scegliere in base al tipo di contenuto che devi mostrare (es. solo immagini, immagini e testo, ecc.).
Per aggiungere un flexbox:
- Clicca su Aggiungi elementi
sul lato sinistro dell'Editor
- Clicca su Strumenti layout
- Clicca su Flexbox
- Trascina e rilascia il flexbox che hai scelto sulla pagina
![Il pannello Aggiungi elementi nell'Editor Studio. Il cursore si trova su un layout flexbox](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/651c25b0-2d60-43c8-addf-1df2fd575568/2023/10/13/01ca719d-aedc-47b3-a69d-476a537fa799/a93c59dd-8480-44f0-9b02-ce435ce11c02.png)
Guarda come funziona:
Trascina le maniglie sull'area di lavoro per vedere come il contenuto del flexbox si riorganizza senza problemi tra i punti di interruzione.
Passaggio 2 | Aggiungi elementi a un flexbox
Un flexbox è composta da diversi elementi che sono contenitori responsivi. Puoi modificare il numero di elementi in un flexbox e questo ridimensionerà automaticamente gli elementi per adattarli allo spazio disponibile.
Per aggiungere un nuovo elemento, puoi cliccare su Aggiungi Elemento o puoi utilizzare il pannello Gestisci elementi nel pannello Ispezione.
![Un flexbox vuoto nell'Editor. Il cursore si trova sul tasto Aggiungi Elemento](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/651c25b0-2d60-43c8-addf-1df2fd575568/2023/10/13/cc394dfe-14d1-4137-9c71-978a46bc4e97/db16b309-3bb0-4afe-9c2b-e8e5a09c8a4e.png)
Passaggio 3 | Aggiungi elementi a un flexbox
Scegli cosa vuoi mostrare nel tuo flexbox aggiungendo elementi agli elementi. Puoi nascondere o mostrare gli elementi su diversi punti di interruzione per creare un'esperienza unica per i visitatori, indipendentemente dal dispositivo.
Per aggiungere elementi a un elemento:
- Clicca su Aggiungi elementi
sul lato sinistro dell'Editor
- Seleziona il tipo di elemento che vuoi aggiungere
- Clicca sull'elemento scelto per aggiungerlo alla tua pagina
- Trascina l'elemento sull'elemento del flexbox e rilascialo quando vedi Unisci
![Un tasto che è stato trascinato in un flexbox. Viene visualizzato il messaggio Unisci](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/651c25b0-2d60-43c8-addf-1df2fd575568/2023/10/17/057f5bbf-0aa8-48bf-b993-002c6427bbf4/fbafaa01-78e3-4504-93f0-0b68cce93b2d.png)
Qual è il prossimo passo?
Personalizza e gestisci il tuo flexbox per visualizzare il contenuto che desideri, come desideri.