De teckensnitt som är tillgängliga för innehåll i HubSpot beror på typen av innehåll och typen av teckensnitt. Vissa standardteckensnitt är tillgängliga i alla innehållsredigerare, medan webbteckensnitt (t.ex. Google Fonts) och anpassade teckensnitt har ytterligare begränsningar, som beskrivs nedan:
Typ av innehåll | Typ av teckensnitt | ||
Standardteckensnitt | Webbteckensnitt | Anpassade teckensnitt |
|
Sida - temamallar | ✓ | Tillgänglig i temainställningar och via stilmall | ✓ |
Sida - kodad mall | ✓ | Tillgänglig via stylesheet eller anpassad modul | Tillgänglig via stilmall |
Blogg | ✓ | Tillgänglig via stylesheet eller anpassad modul | ✓ |
E-post | Vissa standardteckensnitt är inte tillgängliga i e-postredigeraren med dra-och-släpp-funktion | Endast tillgängligt för specialkodade e-postmallar; stöds inte i de flesta e-postklienter | Endast tillgängligt för specialkodade e-postmallar; stöds inte i de flesta e-postklienter |
Kunskapsbas | ✓ | Tillgänglig på fliken Design i mallredigeraren | Ej tillgänglig |
Anpassad modul | ✓ | Tillgänglig för anpassade moduler som inte används i e-postmeddelanden | Tillgänglig för anpassade moduler som inte används i e-postmeddelanden |
CTA (äldre) | ✓ | ✓ | ✓ |
CTA | ✓ | ✓ | ✓ |
Observera: alla innehållstyper är inte tillgängliga i alla konton. de innehållstyper som är tillgängliga för prenumerationerna i ditt HubSpot-konto finns i produkt- och tjänstekatalogen.
Standardteckensnitt kan användas i alla typer av innehåll och är utformade för att laddas på de flesta plattformar och enheter.
Navigera till ditt innehåll:
Andale Mono*
Arial
Book Antiqua*
Courier New
Georgia
Helvetica
Impact*
Symbol*
Tahoma
Terminal *.
Times New Roman
Trebuchet MS
Verdana
*Inte tillgängligt i e-postredigeraren med dra-och-släpp-funktion.
**Bara tillgängligt som ett webbtypsnitt i e-postredigeraren med dra-och-släpp-funktion.
Webbtypsnitt är tillgängliga som standard i innehållsredigeraren för sidor som använder startmallar och teman, samt för artiklar i kunskapsdatabasen och anpassade moduler.
Om du är utvecklare kan du också använda font-fältet för att lägga till webbtypsnitt i teman och anpassade moduler. När webbtypsnitt används på dessa sätt laddas de inte från en tredjepartstjänst, utan HubSpot laddar dem direkt på innehållets domän.
Observera: webbteckensnitt kan inte väljas i rullgardinsmenyn för teckensnitt i redigeraren för rik text.
Du kan också använda tredjepartstjänster som Google Fonts genom att kopiera typsnittets importkod, klistra in den i innehållets stilmall och sedan tillämpa typsnittet via CSS:
När du har koden från Google Fonts kan du lägga till teckensnittet i ditt HubSpot-innehåll:
<head>
i mallen klistrar du in @import-koden mellan <style>....</style>
-taggarna.Observera: Google Fonts är inte tillgängliga för anpassade moduler som används i e-postmallar.
Navigera till ditt innehåll:
Som ett alternativ till att använda standardwebbtypsnitt eller ett typsnittsbibliotek som Google Fonts kan du ladda upp typsnittsfiler och sedan använda dem i teman eller referera till dem i stilmallar.
I temaredigeraren kan du ladda upp ett anpassat teckensnitt och sedan använda det teckensnittet på sidor och i inlägg. Teckensnittsfiler stöds i följande format: TTF, OTF, WOFF.
Navigera till ditt innehåll:
När du har laddat upp ett anpassat teckensnitt i temaredigeraren kan du ladda upp ytterligare teckensnitt, anpassa befintliga teckensnitt med ytterligare teckensnittsstilar eller ta bort teckensnitt.
Navigera till ditt innehåll:
Observera: Om du tar bort ett teckensnitt tas det bort från alla rullgardinsmenyer, men teckensnittsfilerna finns kvar i filverktyget tills de tas bort där.
Som ett alternativ till att använda standardwebbtypsnitt eller ett typsnittsbibliotek som Google Fonts kan du hosta typsnittsfiler i filverktyget och sedan referera till dem i din stilmall.
Observera: anpassade teckensnitt är endast tillgängliga på konton med tillgång till designhanteraren och måste tillämpas med CSS. Om du lägger till ett anpassat typsnitt läggs inte typsnittet till i rullgardinsmenyerna för styling i innehållsredigeraren.
Om du vill använda ett teckensnitt i innehåll laddar du upp teckensnittets filer till filverktyget. Vi rekommenderar att du laddar upp minst .woff-, .ttf- och .eot-versioner av teckensnittet för att säkerställa att ditt teckensnitt laddas i alla webbläsare. Du kan använda expertläget i Font Squirrels konverteringsverktyg för att generera ytterligare filformat.
När du har lagt till ett anpassat teckensnitt i filverktyget kan du referera till det i en stilmall. Varje typsnittsstil (kursiv, fet etc.) kräver en separat @font-face-regel. Läs mer om hur du arbetar med stilmallar i 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');}
Anpassade teckensnitt stöds inte i de flesta populära e-postklienter. För att säkerställa en konsekvent upplevelse för dina läsare rekommenderas att du använder standardwebbtypsnitt i e-postmeddelanden. Om du vill lägga till ett anpassat teckensnitt i en e-postmall med anpassad kod kan du dock göra det när du har lagt till det anpassade teckensnittet i filverktyget.
@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');}
När du har lagt till ett anpassat teckensnitt i ditt tema kan du använda det med CTA:er:
På samma sätt som med CTA:er kan du efter att ha laddat upp en anpassad formulärfil använda den med äldre CTA:er:
font-family: 'Your Font Name';
När du har lagt till ett anpassat teckensnitt i filverktyget kan du använda det i anpassade blogg- eller sidmoduler. Läs om hur du lägger till ett anpassat teckensnitt i en e-postmall med anpassad kod.
@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');}