Nei touchpoint del sito web è possibile aggiungere classi CSS personalizzate in Aspetto > Editor:
Queste classi saranno aggiunte al contenitore (#datatrics-box-container) del touchpoint del sito web.
Ciò significa che è possibile aggiungere qualsiasi stile per qualsiasi classe aggiunta al touchpoint, nelle impostazioni del tema del progetto. Nell'immagine qui sopra, la classe CSS datatrics-academy--smaller è stata aggiunta al touchpoint.
Ora aggiungiamo al tema del progetto lo stile che rende il touchpoint più piccolo:
Tutti i touchpoint con la classe CSS datatrics-academy--smaller hanno ora questo stile. Questo metodo evita di dover copiare il CSS da un touchpoint all'altro e di doverlo modificare ovunque quando si deve cambiare lo stile.
È possibile utilizzare più classi CSS come si farebbe normalmente, semplicemente separandole con uno spazio.
Esempio di CSS utilizzato in questo articolo:
@media (min-width: 580px) {
#datatrics-box-container.datatrics-academy--smaller {
width: 320px;
}
}
Esempio di classe CSS utilizzata in questo articolo:
datatrics-academy--smaller