Controlla con precisione le dimensioni di ogni elemento nel Page Builder di GoHighLevel / Squadd usando la funzione Dimensione Container. Questo articolo ti mostra come impostare altezza e larghezza personalizzate, scegliere l'unità di misura giusta e assegnare valori diversi per desktop e mobile.
Cos'è il Controllo Dimensione Container (Altezza e Larghezza)?
Dimensione Container (Container Size) è un controllo integrato nel page builder che ti permette di definire direttamente nell'editor l'altezza e la larghezza di un elemento. Questi valori determinano quanto spazio un elemento occupa all'interno del suo contenitore padre (ad esempio, colonna, riga o sezione). Puoi scegliere le unità più adatte ai tuoi obiettivi di layout e impostare valori specifici per dispositivo per design responsive.
Principali vantaggi del Controllo Dimensione Container
Layout precisi: Ottimizza le dimensioni degli elementi per design esatti.
Controllo responsive: Imposta valori diversi per desktop e mobile.
Flessibilità delle unità: Scegli tra più unità di misura per selezionare quella più adatta allo scenario specifico.
Build più pulite: Ottieni risultati precisi nell'interfaccia invece di ricorrere a CSS personalizzato.
Unità di misura supportate
Unità diverse cambiano il modo in cui le dimensioni vengono calcolate. Le seguenti unità standard del web design sono disponibili, così puoi scegliere quella più adatta al tuo progetto!
- px – numero fisso di pixel (dimensione esatta)
- % – percentuale del contenitore padre
- em / rem – scala relativa alla dimensione del font
- vh / vw – altezza o larghezza basata sul viewport
- auto – il browser determina la dimensione ottimale
Come modificare la Dimensione Container
Segui questi passaggi per assegnare dimensioni precise agli elementi in pochi clic:
Passo 1: Apri il Page Builder
- Apri il Page Builder per il tuo funnel o la pagina del sito web navigando in Siti (Sites) > Funnel o Siti web (Websites).
- Seleziona il Sito/Funnel e poi apri l'Editor per la pagina che desideri modificare.
Passo 2: Seleziona l'elemento
Seleziona l'elemento che vuoi ridimensionare (testo, pulsante, immagine, modulo, ecc.)
Passo 3: Vai a Dimensione Container
Nella barra laterale destra, seleziona la scheda Stili (Styles). Poi scorri fino alla sezione Dimensione Container (Container Size).
Passo 4: Imposta le dimensioni
Seleziona un'unità di misura (px, %, ecc.) dal menu a tendina accanto ad Altezza (Height) e Larghezza (Width). Poi inserisci la dimensione desiderata per Altezza e Larghezza.
Passo 5: Ottimizza per mobile
Usa il selettore dispositivo accanto a Dimensione Container per passare alla Vista Mobile (Mobile View) e inserire un valore specifico per mobile, se necessario.
Domande frequenti
D: Posso usare i decimali, ad esempio 33,33% per colonne uguali?
Sì! I decimali sono supportati per un controllo preciso (es. 33,33% × 3 card). Verifica il risultato su mobile per evitare interruzioni di riga indesiderate.
D: Come posso annullare le modifiche?
Imposta l'unità su auto per ripristinare le dimensioni naturali dell'elemento.
D: I valori mobile influenzano il desktop?
No. I valori impostati nella vista mobile si applicano solo al mobile, lasciando invariate le impostazioni desktop.
D: Posso continuare a usare le impostazioni di Margine e Padding?
Assolutamente sì! Il controllo Altezza e Larghezza aggiunge un ulteriore livello: usali tutti e tre insieme per un controllo completo del layout.
D: Sono ammessi valori negativi o zero per larghezza/altezza?
I valori negativi (o 0) non sono supportati. Se viene inserito un valore pari a 0 o inferiore, l'elemento manterrà le dimensioni attuali.