I file CSS (Cascading Style Sheets) sono file codificati che selezionano gli elementi della pagina e ne controllano la presentazione. I file CSS non possono essere allegati alle e-mail o ai modelli di e-mail.
Questo articolo spiega come creare, pubblicare e allegare un file CSS in HubSpot. Si apprende come apportare semplici modifiche al design di una determinata pagina. Se utilizzate un modello di tema, imparate a modificare le impostazioni del tema.
Una volta creato o aperto un file CSS esistente, è possibile modificarlo nell'editor di codice. Oltre ai CSS standard, l'editor di codice supporta le variabili e le macro di HubL per facilitare la manutenzione dei CSS. Per visualizzare un'anteprima del rendering di HubL, fare clic per attivare l' interruttoreMostra output nella parte superiore dell'editor. Sulla destra si aprirà un pannello con l'anteprima del rendering.
Per vedere un elenco di selettori CSS standard per i template di HubSpot, consultate Boilerplate CSS.
Prima di pubblicare, verificare la presenza di errori HubL nel codice. Ci sono tre posti dove trovare errori o avvertimenti di HubL in un modulo personalizzato o in un file codificato:
Gli errori che impediscono la pubblicazione sono in rosso, mentre gli avvertimenti generali sono in giallo. Nella parte inferiore dell'editor di codice, fare clic su Mostra dettagli per visualizzare ulteriori informazioni sugli errori nella console degli errori e su Nascondi dettagli per chiudere la console degli errori.
Nella console degli errori, ci saranno collegamenti a tutti i punti in cui sono presenti errori o avvisi di HubL nel codice o nel modulo personalizzato. Passare il mouse sugli indicatori di errore rossi sul lato sinistro dell'editor di codice per visualizzare l'errore o l'avvertenza nel codice. Facendo clic sull'errore, il cursore si sposta su tutti gli errori o le avvertenze di quella riga. Facendo clic su un'annotazione della barra di scorrimento si accede a quella parte del file.
È anche possibile fare clic su un numero di riga all'interno dell'editor di codice e far sì che l'URL del file si aggiorni di conseguenza. In questo modo è possibile condividere un link al codice con altri utenti e indirizzarli esattamente al punto in cui si sta lavorando all'interno del file.
Dopo aver modificato il file, fare clic su Pubblica modifiche in alto a destra. Se si desidera richiamare questo foglio di stile in un altro modello codificato, copiare l'URL del foglio facendo clic su Azioni > Copia URL pubblico nel menu della barra laterale sinistra.
In HubSpot è possibile allegare i fogli di stile ai contenuti in diversi modi. Di seguito è riportato l'ordine in cui i fogli di stile allegati sono collegati al sito:
* Richiesto
** Richiesto per i layout drag and drop
*** Metodo consigliato per l'allegato del foglio di stile per i layout dei modelli
Per allegare i fogli di stile a un modello, aprire il modello nel design manager. Nel menu della barra laterale destra, sotto Opzioni testa e corpo, selezionare un file dal menu a discesa Aggiungi accanto a Fogli di stile collegati.
È possibile modificare o rimuovere un foglio di stile già allegato passandoci sopra e facendo clic su Modifica per apportarvi modifiche o sulla X per rimuoverlo.
Dopo aver aggiunto un foglio di stile, fare clic su Pubblica modifiche nell'angolo superiore destro per applicare le modifiche alle pagine live che utilizzano il modello.
Nota bene: questa opzione non è disponibile per i modelli di tema. Scopri come modificare le impostazioni del tema.
Per aggiungere o rimuovere un foglio di stile specifico della pagina dalla sezione impostazioni dell'editor di pagina:
Navigare verso il proprio contenuto:
Nota bene: imodelli di tema devono includere l'annotazione enableDomainStylesheets: true perpoter usare i fogli di stile a livello di dominio. Per saperne di più sulle annotazioni dei template.
Per aggiungere o rimuovere un foglio di stile da tutti i contenuti di un dominio:
Nota bene: quando si effettua il downgrade agli strumenti Starter o gratuiti di HubSpot, i fogli di stile allegati a livello di dominio rimangono attivi finché non vengono rimossi. Una volta rimossi tutti i fogli di stile, non è più possibile allegare fogli di stile a livello di dominio. Per saperne di più sul downgrade di un abbonamento.