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.
In questo articolo, scopri di più su come:
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 il colore dello sfondo e rendilo più o meno visibile
- 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
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
Hai trovato utile questo articolo?
|