Czcionki dostępne dla treści w HubSpot zależą od typu treści i rodzaju czcionki. Niektóre domyślne czcionki są dostępne we wszystkich edytorach treści, podczas gdy czcionki internetowe (takie jak Google Fonts) i czcionki niestandardowe mają dodatkowe ograniczenia, opisane poniżej:
| Typ zawartości | Typ czcionki | ||
| Domyślne czcionki | Czcionki internetowe | Czcionki niestandardowe |
|
| Strona - szablony motywów | ✓ | Dostępne w ustawieniach motywu i poprzez arkusz stylów | ✓ |
| Strona - zakodowany szablon | ✓ | Dostępne za pośrednictwem arkusza stylów lub modułu niestandardowego | Dostępne za pośrednictwem arkusza stylów |
| Blog | ✓ | Dostępne za pośrednictwem arkusza stylów lub modułu niestandardowego | ✓ |
| Niektóre domyślne czcionki nie są dostępne w edytorze wiadomości e-mail typu "przeciągnij i upuść". | Dostępne tylko dla niestandardowych szablonów wiadomości e-mail; nieobsługiwane w większości klientów poczty e-mail. | Dostępne tylko dla niestandardowych szablonów wiadomości e-mail; nieobsługiwane w większości klientów poczty e-mail. | |
| Baza wiedzy | ✓ | Dostępne na karcie Projekt w edytorze szablonów | Niedostępne |
| Moduł niestandardowy | ✓ | Dostępne dla niestandardowych modułów nieużywanych w wiadomościach e-mail | Dostępne dla niestandardowych modułów nieużywanych w wiadomościach e-mail |
| CTA (legacy) | ✓ | ✓ | ✓ |
| CTA | ✓ | ✓ | ✓ |
Uwaga: nie wszystkie typy zawartości są dostępne na wszystkich kontach. Typy zawartości dostępne dla subskrypcji na koncie HubSpot można znaleźć w Katalogu produktów i usług.
Domyślne czcionki mogą być używane we wszystkich rodzajach treści i są zaprojektowane tak, aby ładować się na większości platform i urządzeń.
Przejdź do swojej zawartości:
Andale Mono*
Arial
Book Antiqua*
Courier New
Georgia
Helvetica
Impact*
Symbol*
Tahoma
Terminal*
Times New Roman
Trebuchet MS
Verdana
* Niedostępne w edytorze wiadomości e-mail typu "przeciągnij i upuść".
**Dostępna tylko jako czcionka internetowa w edytorze wiadomości e-mail typu "przeciągnij i upuść".
Czcionki internetowe są domyślnie dostępne w edytorze treści dla stron korzystających z szablonów startowych i motywów, a także artykułów bazy wiedzy i modułów niestandardowych.
Jeśli jesteś programistą, możesz również użyć pola czcionki, aby dodać czcionki internetowe do motywów i modułów niestandardowych. W przypadku użycia w ten sposób czcionki internetowe nie są ładowane z usługi innej firmy; HubSpot zamiast tego załaduje je bezpośrednio w domenie treści.
Uwaga: czcionek internetowych nie można wybrać w menu rozwijanym czcionek edytora tekstu sformatowanego.
Możesz także skorzystać z usług innych firm, takich jak Google Fonts, kopiując kod importu czcionki, wklejając go do arkusza stylów treści, a następnie stosując czcionkę za pomocą CSS:
Po uzyskaniu kodu z Google Fonts można dodać czcionkę do treści HubSpot:
<head> szablonu wklej kod @import między znacznikami <style>....</style>.Uwaga: czcionki Google Fonts nie są dostępne dla niestandardowych modułów używanych w szablonach wiadomości e-mail.
Przejdź do swojej zawartości:
Jako alternatywę dla korzystania ze standardowych czcionek internetowych lub biblioteki czcionek, takiej jak Google Fonts, można przesyłać pliki czcionek, a następnie używać ich w motywach lub odwoływać się do nich w arkuszach stylów.
W edytorze motywu można przesłać niestandardową czcionkę, a następnie użyć jej na stronach i w postach. Pliki czcionek są obsługiwane w następujących formatach: TTF, OTF, WOFF.
Przejdź do swojej zawartości:
Po przesłaniu niestandardowej czcionki w edytorze szablonów można przesłać dodatkowe czcionki, dostosować istniejące czcionki za pomocą dodatkowych stylów czcionek lub usunąć czcionki.
Przejdź do swojej zawartości:
Uwaga: usunięcie czcionki powoduje usunięcie jej ze wszystkich menu rozwijanych, ale pliki czcionek pozostaną w narzędziu plików do momentu ich usunięcia.
Alternatywnie do korzystania ze standardowych czcionek internetowych lub bibliotek czcionek, takich jak Google Fonts, można hostować pliki czcionek w narzędziu plików, a następnie odwoływać się do nich w arkuszu stylów.
Uwaga: niestandardowe czcionki są dostępne tylko na kontach z dostępem do menedżera projektów i muszą być stosowane z CSS. Dodanie niestandardowej czcionki nie spowoduje dodania czcionki do rozwijanych menu stylizacji w edytorze treści.
Aby użyć czcionki w treści, prześlij jej pliki do narzędzia plików. Zaleca się przesłanie co najmniej wersji .woff, .ttf i .eot czcionki, aby upewnić się, że czcionka ładuje się we wszystkich przeglądarkach. Możesz użyć trybu eksperta w narzędziu konwertera Font Squirrel, aby wygenerować dodatkowe formaty plików.
Po dodaniu niestandardowej czcionki do narzędzia plików można odwoływać się do niej w arkuszu stylów. Każdy styl czcionki (kursywa, pogrubienie itp.) będzie wymagał osobnej reguły @font-face. Dowiedz się więcej o pracy z arkuszami stylów w 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');}
Czcionki niestandardowe nie są obsługiwane przez większość popularnych klientów poczty e-mail. Aby zapewnić czytelnikom spójne wrażenia, zaleca się używanie domyślnych czcionek internetowych w wiadomościach e-mail. Jeśli jednak chcesz dodać niestandardową czcionkę do niestandardowego szablonu wiadomości e-mail, możesz to zrobić po dodaniu niestandardowej czcionki do narzędzia plików.
@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');}Po dodaniu niestandardowej czcionki do szablonu możesz użyć jej w wezwaniach do działania:
Podobnie jak w przypadku wezwań do działania, po przesłaniu niestandardowego pliku formularza można go używać ze starszymi wezwaniami do działania:
font-family: 'Your Font Name';
Po dodaniu niestandardowej czcionki do narzędzia plików można jej używać w niestandardowych modułach bloga lub strony. Dowiedz się, jak dodać niestandardową czcionkę do niestandardowego kodowanego szablonu wiadomości e-mail.
@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');}