Aggiungi CSS e JavaScript personalizzato ai tuoi Gruppi di Communities per perfezionare il branding, il layout e i comportamenti interattivi. Questo articolo mostra dove puoi inserire il tuo codice CSS o JavaScript.
Nota: GoHighLevel / Squadd non fornisce indicazioni, raccomandazioni o supporto per il codice personalizzato (inclusa la scrittura, il debug o la manutenzione).
- Cos'è l'aggiunta di CSS/JS personalizzato ai Gruppi?
- Vantaggi principali dell'aggiunta di CSS/JS personalizzato
- Come aggiungere CSS/JS personalizzato ai Gruppi
- Domande frequenti
- Articoli correlati
Cos'è l'aggiunta di CSS/JS personalizzato ai Gruppi?
Aggiungere CSS e JavaScript personalizzato a livello di gruppo ti consente di modificare l'aspetto e il comportamento del tuo gruppo senza alterare altre parti di Communities. Puoi incollare il codice direttamente, testarlo in sicurezza e poi pubblicarlo per i membri con tranquillità.
Vantaggi principali dell'aggiunta di CSS/JS personalizzato
Branding preciso: adatta font, spaziature e componenti alle linee guida del tuo brand.
Modifiche mirate: applica CSS/JS a un singolo gruppo senza influenzare gli altri.
Rilascio controllato: usa Test Preview prima di attivare la Modalità Live.
UX migliorata: arricchisci la navigazione o le micro-interazioni con piccoli snippet JS.
Flessibilità mobile: personalizza le regole responsive per smartphone e tablet.
Come aggiungere CSS/JS personalizzato ai Gruppi
Segui questi passaggi per aggiungere codice personalizzato ai tuoi gruppi:
Accedi alla tua Location (sub-account).
Vai su Membership > Communities > Gruppi.
Accedi al Gruppo che vuoi personalizzare.
Clicca su Impostazioni (Settings) nel gruppo.
Clicca sulla scheda Branding e scorri fino a Opzioni avanzate (Advanced Options), quindi clicca per espanderla.
Scorri fino ai campi CSS personalizzato (Custom CSS) e JavaScript personalizzato (Custom JavaScript) e incolla il tuo codice.
Clicca su Test Preview per verificare le modifiche.
Se sei soddisfatto, attiva la Modalità Live su On. In caso contrario, apporta le correzioni necessarie e testa nuovamente.
Clicca su Salva (Save) per completare l'operazione.
Domande frequenti
D: Posso disattivare rapidamente il codice personalizzato per risolvere un problema?
Sì. Disattiva la Modalità Live.
D: Cosa devo fare se riscontro problemi in una community dopo aver applicato codice personalizzato?
Se riscontri problemi in una community in cui è stato implementato HTML, CSS o JavaScript personalizzato, è importante verificare se il problema è causato dal codice personalizzato. Per farlo, puoi disabilitarlo temporaneamente e controllare se il problema persiste. Aggiungi semplicemente customCode=false alla fine dell'URL della community nella barra degli indirizzi del browser e premi Invio. Questa azione disattiva il codice personalizzato per la sessione corrente, permettendoti di verificare se il problema si ripresenta senza le personalizzazioni. Se il problema si risolve con il codice personalizzato disattivato, significa che potrebbe essere necessario apportare modifiche al codice.
D: Come posso applicare stili diversi per la modalità scura e quella chiara nel mio portale community?
Per applicare stili specifici alla modalità notturna (tema scuro), usa la classe .dark nel tuo CSS. Questa classe viene applicata automaticamente all'elemento radice quando la modalità notturna è attiva.
Evita di usare selettori troppo generici come div:nth-of-type(2) a meno che tu non sia assolutamente certo che non influenzeranno altre parti della pagina. Esegui sempre un'anteprima e testa entrambe le modalità per garantire la coerenza visiva.