Editor Studio: utilizzare i contenitori
Tempo di lettura: 3 min.
I contenitori sono strumenti di layout responsivi che ti aiutano a semplificare e strutturare il contenuto del sito. Puoi personalizzarli per completare il design del sito e allegare elementi come testo, contenuti multimediali e tasti.
Aggiungere contenitori a un sito
Inizia aggiungendo un contenitore adatto al design e alle esigenze di contenuto del cliente. Puoi scegliere tra una gamma di contenitori predefiniti e al passaggio del mouse o iniziare da zero con un design vuoto.
Per aggiungere un contenitore:
- Clicca su Aggiungi elementi
sul lato sinistro dell'Editor - Seleziona Contenitori
- Scegli uno stile contenitore (vuoto, progettato o al passaggio mouse)
- Clicca e trascina il contenitore scelto per aggiungerlo alla pagina
Progettare i contenitori
Personalizza il design del contenitore per adattarsi all'aspetto del sito. Puoi modificare il colore dello sfondo, impostare il raggio e altro ancora.
Per progettare un contenitore:
- Seleziona il contenitore pertinente
- Clicca sull'icona Apri Ispezione
in alto a destra dell'Editor
- Scegli come vuoi personalizzare il contenitore sotto Design:
- Sfondo: imposta lo sfondo e rendilo più o meno visibile:
- Colore: seleziona i colori del tema del sito o la tua tonalità personalizzata
- Gradiente: applica un gradiente o un gradiente sfumato al contenitore. Puoi scegliere i colori, gli angoli e altro ancora
- Effetto vetro: applica un effetto vetro al contenitore e imposta l'intensità della sfocatura
- Bordo: aggiungi un bordo al contenitore e utilizza le opzioni per impostarne le dimensioni, il colore e l'opacità
- Angoli: regola il raggio degli angoli del contenitore (in px) per renderli più arrotondati o squadrati
- Ombra: aggiungi e personalizza un effetto di ombreggiatura sul contenitore
- Sfondo: imposta lo sfondo e rendilo più o meno visibile:
Unire elementi ai contenitori
Quando metti degli elementi all'interno di un contenitore, questi vengono uniti automaticamente. Ciò significa che puoi trascinare il contenitore e gli elementi che hai allegato a esso, e visualizzarli insieme nel pannello Livelli.
Per unire un elemento a un contenitore:
- Clicca sull'elemento pertinente
- Trascinalo nella posizione desiderata nel contenitore
- Rilascia l'elemento quando vedi il messaggio Unisci
Applicare una griglia a un contenitore
Applica una griglia CSS avanzata al contenitore per strutturarne il layout. Puoi scegliere il numero di righe e colonne che desideri e impostarne le dimensioni utilizzando misurazioni reattive (es. fr, Min/max, %).
Per applicare una griglia a un contenitore:
- Seleziona il contenitore pertinente
- Clicca sull'icona Altre azioni
- Clicca su Applica griglia CSS avanzata
- Scegli un layout dal menu a tendina 1x1
Suggerimento: seleziona Altro se vuoi impostare il tuo numero di righe e colonne
