I font disponibili per i contenuti in HubSpot dipendono dal tipo di contenuto e dal tipo di font. Alcuni font predefiniti sono disponibili in tutti gli editor di contenuti, mentre i font web (come Google Fonts) e i font personalizzati hanno ulteriori restrizioni, descritte di seguito:
| Tipo di contenuto | Tipo di carattere | ||
| Font predefiniti | Font web | Caratteri personalizzati |
|
| Pagina - modelli di tema | ✓ | Disponibile nelle impostazioni del tema e tramite il foglio di stile | ✓ |
| Pagina - modello codificato | ✓ | Disponibile tramite foglio di stile o modulo personalizzato | Disponibile tramite foglio di stile |
| Blog | ✓ | Disponibile tramite foglio di stile o modulo personalizzato | ✓ |
| Alcuni font predefiniti non sono disponibili nell'editor di posta elettronica drag and drop | Disponibile solo per i modelli di email codificati in modo personalizzato; non è supportato dalla maggior parte dei client di posta elettronica. | Disponibile solo per i modelli di email codificati in modo personalizzato; non è supportato dalla maggior parte dei client di posta elettronica. | |
| Base di conoscenze | ✓ | Disponibile nella scheda Progettazione dell'editor dei modelli | Non disponibile |
| Modulo personalizzato | ✓ | Disponibile per i moduli personalizzati non utilizzati nelle e-mail | Disponibile per i moduli personalizzati non utilizzati nelle e-mail |
| CTA (eredità) | ✓ | ✓ | ✓ |
| CTA | ✓ | ✓ | ✓ |
Attenzione: non tutti i tipi di contenuto sono disponibili per tutti gli account. I tipi di contenuto disponibili per gli abbonamenti del vostro account HubSpot si trovano nel Catalogo prodotti e servizi.
I font predefiniti possono essere utilizzati in tutti i tipi di contenuti e sono progettati per essere caricati sulla maggior parte delle piattaforme e dei dispositivi.
Navigare verso il proprio contenuto:
Andale Mono*
Arial
Book Antiqua*
Courier New
Georgia
Helvetica
Impact*
Simbolo*
Tahoma
Terminale*
Times New Roman
Trebuchet MS
Verdana
*Non disponibile nell'editor di e-mail con trascinamento.
**Disponibile solo come font web nell'editor di posta elettronica drag and drop.
I font Web sono disponibili per impostazione predefinita nell'editor dei contenuti per le pagine che utilizzano modelli e temi di partenza, nonché per gli articoli della knowledge base e i moduli personalizzati.
Se siete sviluppatori, potete anche utilizzare il campo font per aggiungere font web a temi e moduli personalizzati. Quando vengono utilizzati in questo modo, i web font non vengono caricati da un servizio di terze parti; HubSpot li caricherà invece direttamente sul dominio del contenuto.
Nota bene: i font web non possono essere selezionati nel menu a discesa dei font dell'editor di testo.
È anche possibile utilizzare servizi di terze parti, come Google Fonts, copiando il codice di importazione del font, incollandolo nel foglio di stile del contenuto e applicando poi il font tramite i CSS:
Una volta ottenuto il codice da Google Fonts, è possibile aggiungere il font ai contenuti di HubSpot:
<head> del modello, incollare il codice @import tra i tag <style>....</style>.Nota bene: i font di Google non sono disponibili per i moduli personalizzati utilizzati nei modelli di e-mail.
Navigare verso il proprio contenuto:
In alternativa all'uso di font web standard o di una libreria di font come Google Fonts, è possibile caricare file di font, quindi utilizzarli nei temi o farvi riferimento nei fogli di stile.
Nell'editor del tema è possibile caricare un font personalizzato e utilizzarlo nelle pagine e nei post. I file di font sono supportati nei seguenti formati: TTF, OTF, WOFF.
Navigare verso il proprio contenuto:
Una volta caricato un carattere personalizzato nell'editor del tema, è possibile caricare altri caratteri, personalizzare quelli esistenti con stili di carattere aggiuntivi o eliminarli.
Navigare verso il proprio contenuto:
Nota bene: l'eliminazione di un font lo rimuove da tutti i menu a discesa, ma i file dei font rimangono nello strumento File finché non vengono eliminati.
In alternativa all'uso di font web standard o di una libreria di font come Google Fonts, è possibile ospitare i file di font nello strumento file e poi farvi riferimento nel foglio di stile.
Nota bene: i font personalizzati sono disponibili solo negli account con accesso al design manager e devono essere applicati con i CSS. L'aggiunta di un font personalizzato non aggiungerà il font ai menu a discesa dello stile nell'editor dei contenuti.
Per utilizzare un font nei contenuti, caricare i file del font nello strumento file. Si consiglia di caricare almeno le versioni .woff, .ttf e .eot del font per garantire il caricamento del font su tutti i browser. È possibile utilizzare la modalità Expert dello strumento convertitore di Font Squirrel per generare altri formati di file.
Una volta aggiunto un font personalizzato allo strumento file, è possibile fare riferimento ad esso in un foglio di stile. Ogni stile di carattere (corsivo, grassetto, ecc.) richiederà una regola @font-face separata. Per saperne di più su come lavorare con i fogli di stile in HubSpot.
@font-face { font-family: 'Your Font Name'; src: url('your_font_file.eot?') format('eot'), url('your_font_file.woff') format('woff'), url('your_font_file.ttf') format('truetype');}
I font personalizzati non sono supportati dalla maggior parte dei client di posta elettronica. Per garantire un'esperienza coerente ai lettori, si consiglia di utilizzare i font web predefiniti nelle e-mail. Tuttavia, se desiderate aggiungere un font personalizzato a un modello di email codificato, potete farlo dopo aver aggiunto il font personalizzato allo strumento file.
@font-face { font-family: 'Your Font Name'; src: url('your_font_file.eot?') format('eot'), url('your_font_file.woff') format('woff'), url('your_font_file.ttf') format('truetype');}Dopo aver aggiunto un font personalizzato al tema, è possibile utilizzarlo con le CTA:
Analogamente alle CTA, dopo aver caricato un file di modulo personalizzato, è possibile utilizzarlo con le CTA tradizionali:
font-family: 'Your Font Name';
Una volta aggiunto un font personalizzato allo strumento file, è possibile utilizzarlo nei moduli personalizzati di blog o pagine. Scoprite come aggiungere un font personalizzato a un modello di e-mail con codice personalizzato.
@font-face { font-family: 'Your Font Name'; src: url('your_font_file.eot?') format('eot'), url('your_font_file.woff') format('woff'), url('your_font_file.ttf') format('truetype');}