Przejdź do treści
Uwaga: Tłumaczenie tego artykułu jest podane wyłącznie dla wygody. Tłumaczenie jest tworzone automatycznie za pomocą oprogramowania tłumaczącego i mogło nie zostać sprawdzone. W związku z tym, angielska wersja tego artykułu powinna być uważana za wersję obowiązującą, zawierającą najnowsze informacje. Możesz uzyskać do niej dostęp tutaj.

Używanie czcionek w HubSpot

Data ostatniej aktualizacji: października 3, 2024

Dostępne z każdą z następujących podpisów, z wyjątkiem miejsc, w których zaznaczono:

Wszystkie produkty i plany

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
E-mail 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.

Użyj domyślnych czcionek

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:

    • Strony witryny: Na swoim koncie HubSpot przejdź do Treści > Strony witryny.
    • Strony docelowe: Na swoim koncie HubSpot przejdź do Treści > Strony docelowe..
    • Blog: Na swoim koncie HubSpot przejdź do Treści > Blog.
    • Baza wiedzy: Na swoim koncie HubSpot przejdź do Treści > Baza wiedzy..
    • Email: Na koncie HubSpot przejdź do sekcji Marketing > Marketingowa wiadomość e-mail.
  • Kliknij nazwę swojej zawartości.
  • W edytorze treści kliknij moduł tekstu sformatowanego, a następnie zaznacz tekst, który chcesz edytować.
  • Na pasku narzędzi tekstu sformatowanego kliknij menu rozwijane Czcionka i wybierz czcionkę. W modułach tekstu sformatowanego dostępne są następujące czcionki:
    • Andale Mono*

    • Arial

    • Book Antiqua*

    • Courier New

    • Georgia

    • Helvetica

    • Impact*

    • Lato**
    • Merriweather**
    • Monako*
    • 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ść".

Używanie czcionek internetowych

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:

  • Przejdź do strony fonts.google.com.
  • Na pasku wyszukiwania wprowadź nazwę czcionki.
  • Kliknij nazwę czcionki, aby wyświetlić listę stylów dostępnych do zaimportowania.
  • Obok każdego stylu, który chcesz zaimportować, kliknij + Wybierz ten styl
  • W prawym panelu wybierz @import w sekcji Użyj w sieci .
  • Skopiuj kod czcionki:
    • W sekcji Użyj na stronie internetowej skopiuj kod @import bez znacznika <style>.
    • W polu Reguły CSS określające rodziny skopiuj kod ustawień reguł CSS.

Po uzyskaniu kodu z Google Fonts można dodać czcionkę do treści HubSpot:

Używanie czcionki Google w arkuszu stylów

  • Skopiujkod @import czcionki z Google Fonts.
  • Na swoim koncie HubSpot przejdź do Treści > Design Manager.
  • W wyszukiwarce otwórz arkusz stylów używany dla treści.
  • Wklej kod @import do linii 1 arkusza stylów.
  • Dodaj kod ustawiający reguły CSS do odpowiednich selektorów w arkuszu stylów.
  • W prawym górnym rogu kliknij przycisk Opublikuj zmiany, aby wprowadzić zmiany na żywo.

Używanie czcionki Google Font w niestandardowym szablonie wiadomości e-mail

Chociaż czcionki Google są obsługiwane przez Apple Mail i kilka innych klientów poczty e-mail, szeroka obsługa jest ograniczona, a większość popularnych klientów poczty e-mail obsługuje tylko domyślne czcionki internetowe. Dowiedz się więcej o wybieraniu domyślnych czcionek używanych w klasycznym edytorze poczty e-mail.
Niestandardowe szablony wiadomości e-mail są dostępne tylko na kontach z subskrypcją Marketing Hub Professional lub Enterprise.
Aby dodać czcionkę Google Font do niestandardowego szablonu wiadomości e-mail:
  • Skopiuj kod @import czcionki z Google Fonts.
  • Na swoim koncie HubSpot przejdź do Treści > Design Manager.
  • W wyszukiwarce otwórz zakodowany szablon wiadomości e-mail.
  • W sekcji<head> szablonu wklej kod @import między znacznikami <style>....</style>.
  • W kodzie treści wiadomości e-mail dodaj niestandardową czcionkę w stylu inline.
  • W prawym górnym rogu kliknij przycisk Opublikuj zmiany, aby wprowadzić zmiany na żywo.

Użyj czcionki Google w wezwaniu do działania (starsze wersje)

  • Skopiujkod Google, aby ustawić reguły CSS dla tej czcionki.
  • Na koncie HubSpot przejdź do Marketing > Wezwania do działania.
  • Najedź kursorem na wezwanie do działania, a następnie kliknij Akcje > Edytuj.
  • W prawym panelu kliknij opcję Opcje zaawansowane.
  • W polu tekstowym wklej kod Google do ustawiania reguł CSS dla tej czcionki.
  • W prawym dolnym rogu kliknij przycisk Dalej. Następnie kliknij Zapisz.

Używanie czcionki Google w formularzu

  • Na koncie HubSpot przejdź do sekcji Marketing > Formularze.
  • Najedź kursorem na nazwę formularza i kliknij Akcje > Edytuj formularz lub Utwórz nowy formularz.
  • W edytorze formularzy kliknij kartę Styl i podgląd.
  • W menu na lewym pasku bocznym kliknij sekcję Styl .
  • W sekcji Tekst kliknij menu rozwijane Rodzina czcionek i wybierz czcionkę Google.
  • W prawym górnym rogu kliknij przycisk Aktualizuj lub Publikuj, aby wprowadzić zmiany na żywo.

Używanie czcionki Google w module niestandardowym

Uwaga: czcionki Google Fonts nie są dostępne dla niestandardowych modułów używanych w szablonach wiadomości e-mail.


  • Na swoim koncie HubSpot przejdź do Treści > Design Manager.

  • W prawym górnym rogu kliknij przycisk Opublikuj zmiany , aby wprowadzić zmiany na żywo.
  • Przejdź do swojej zawartości:

    • Strony witryny: Na swoim koncie HubSpot przejdź do Treści > Strony witryny.
    • Strony docelowe: Na swoim koncie HubSpot przejdź do Treści > Strony docelowe..
    • Blog: Na swoim koncie HubSpot przejdź do Treści > Blog.
  • Kliknij nazwę zawartości przy użyciu modułu niestandardowego.
  • W edytorze zawartości kliknij moduł niestandardowy.
  • W edytorze paska bocznego kliknij menu rozwijane Pole czcionki i wybierz czcionkę Google.

Używanie niestandardowych czcionek

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.

Używanie niestandardowych czcionek w motywach

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.

Prześlij niestandardowe czcionki

  • Przejdź do swojej zawartości:

    • Strony witryny: Na swoim koncie HubSpot przejdź do Treści > Strony witryny.
    • Strony docelowe: Na swoim koncie HubSpot przejdź do Treści > Strony docelowe..
    • Blog: Na swoim koncie HubSpot przejdź do Treści > Blog.
  • Kliknij nazwę swojej zawartości.
  • W edytorze zawartości kliknij menu Edycja i wybierz Motyw: [Nazwa motywu].
  • W menu na lewym pasku bocznym kliknij menu rozwijane czcionki i wybierz opcję Prześlij niestandardową czcionkę.
  • W prawym panelu wprowadź etykietę czcionki w polu Nazwa czcionki .
  • Kliknij Wybierz pliki czcionek i wybierz jeden lub więcej plików czcionek, a następnie kliknij Dalej.

  • Kliknij menu rozwijane Styl czcionki 1 i wybierz styl używany przez plik czcionki. Każdy styl musi używać osobnego pliku czcionki.
  • Aby dodać dodatkowe style czcionek, kliknij + Dodaj kolejny styl czcionki, a następnie dodaj swoje style czcionek. Każdy przesłany plik czcionki musi mieć co najmniej jeden powiązany styl.
  • Po dodaniu wszystkich odpowiednich stylów czcionek kliknij przycisk Gotowe.

Edycja niestandardowych czcionek

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:

    • Strony witryny: Na swoim koncie HubSpot przejdź do Treści > Strony witryny.
    • Strony docelowe: Na swoim koncie HubSpot przejdź do Treści > Strony docelowe..
    • Blog: Na swoim koncie HubSpot przejdź do Treści > Blog.
  • Kliknij nazwę swojej zawartości.
  • W edytorze zawartości kliknij menu Edycja i wybierz Motyw: [Nazwa motywu].
  • W menu na lewym pasku bocznym kliknij, aby rozwinąć sekcję Czcionki .
  • Kliknij menu rozwijane czcionki i wybierzZarządzaj czcionkami niestandardowymi.
  • Aby dodać nową czcionkę, kliknij przycisk Dodaj czcionkę niestandardową w oknie dialogowym.
  • Aby edytować czcionkę:
    • W oknie dialogowym kliknij menu rozwijane Akcje obok czcionki i wybierz opcję Edytuj.
    • Aby zmienić nazwę czcionki, kliknij Edytuj obok nazwy czcionki, a następnie wprowadź nową nazwę czcionki.
    • Aby dodać dodatkowe style czcionek, kliknij opcję Dodaj kolejny styl czcionki, a następnie kliknij menu rozwijane Styl czcionki i wybierz styl. Kliknij przycisk Prześlij, a następnie prześlij plik czcionki.
    • Aby usunąć styl czcionki, kliknij ikonęusuwania deletededel   obok stylu czcionki. Nie można usunąć stylu czcionki, jeśli na liście nie ma innych stylów czcionek.
    • Kliknij przycisk Zapisz.
  • Aby usunąć czcionkę, kliknij menu rozwijane Akcje w oknie dialogowym i wybierz opcję Usuń.

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.


  • Po zakończeniu edycji czcionek kliknij przycisk Gotowe.

Używanie niestandardowych czcionek w arkuszach stylów

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.

  • Na koncie HubSpot przejdź do sekcji Biblioteka > Pliki.
  • Kliknij przycisk Prześlij pliki.
  • Na dysku twardym komputera wybierz pliki czcionek, a następnie kliknij przycisk Otwórz.
  • Kliknij nazwę przesłanego pliku czcionki.
  • W prawym panelu kliknij Kopiuj adres URL, aby skopiować adres URL, pod którym znajduje się plik. Potrzebny będzie adres URL czcionki w każdym formacie pliku.

Używanie niestandardowej czcionki w arkuszu styló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.

  • Na swoim koncie HubSpot przejdź do Treści > Design Manager.
  • W wyszukiwarce otwórz arkusz stylów używany dla treści.
  • Dla każdego stylu czcionki:
    • W górnej części arkusza stylów wklej następujący 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');}
    • Zastąp nazwę czcion ki nazwą czcionki.
    • Zastąp your_font_file.xxx? adresem URL z narzędzia plików. Powtórz dla każdego formatu pliku.
  • Utwórz reguły CSS z właściwością font-family, aby zastosować niestandardową czcionkę.
  • W prawym górnym rogu kliknij przycisk Aktualizuj lub Publikuj, aby wprowadzić zmiany na żywo.

Używanie niestandardowej czcionki w niestandardowym kodowanym szablonie wiadomości e-mail

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.

  • Na swoim koncie HubSpot przejdź do Treści > Design Manager.
  • W wyszukiwarce otwórz zakodowany szablon wiadomości e-mail.
  • Dla każdego stylu czcionki:
    • W sekcji <head> szablonu wklej ten kod między znacznikami <style>....</style>:
@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');}
    • Zastąp nazwę czcion ki nazwą czcionki.
    • Zastąp your_font_file.xxx? adresem URL z narzędzia plików. Powtórz dla każdego formatu pliku.
  • W kodzie treści wiadomości e-mail dodaj niestandardową czcionkę w stylu inline.
  • W prawym górnym rogu kliknij przycisk Aktualizuj lub Publikuj, aby wprowadzić zmiany na żywo.

Użyj niestandardowej czcionki w wezwaniu do działania

Po dodaniu niestandardowej czcionki do szablonu możesz użyć jej w wezwaniach do działania:

  • Na koncie HubSpot przejdź do Marketing > Wezwania do działania.
  • W lewym górnym rogu kliknij menu rozwijane i wybierz CTA.
  • Najedź kursorem na wezwanie do działania, a następnie kliknij Akcje > Edytuj.
  • W lewym panelu edytora CTA kliknij kartę Projekt.
  • Kliknij sekcję Style , aby ją rozwinąć.
  • Kliknij menu rozwijane Czcionka podstawowa i wybierz czcionkę niestandardową.
  • Kontynuuj tworzenie wezwania do działania.

Używanie niestandardowej czcionki w wezwaniu do działania (starsze wersje)

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:

  • Na koncie HubSpot przejdź do Marketing > Wezwania do działania.
  • Najedź kursorem na wezwanie do działania, a następnie kliknij Akcje > Edytuj.
  • W prawym panelu kliknij opcję Opcje zaawansowane.
  • W polu tekstowym wklej ten kod:

font-family: 'Your Font Name';

  • Zastąp nazwę czcion ki nazwą czcionki.
  • W prawym dolnym rogu kliknij przycisk Dalej. Następnie kliknij Zapisz.

Używanie niestandardowej czcionki w niestandardowym module

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.

  • Na swoim koncie HubSpot przejdź do Treści > Design Manager.
  • W wyszukiwarce otwórz moduł niestandardowy.
  • W sekcji module.css wklej następujący 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');}
  • Zastąp nazwę czcion ki nazwą czcionki.
  • Zastąp your_font_file.xxx? adresem URL z narzędzia plików. Powtórz dla każdego formatu pliku.
  • Utwórz reguły CSS z właściwością font-family, aby zastosować niestandardową czcionkę.
  • W prawym górnym rogu kliknij przycisk Opublikuj zmiany, aby wprowadzić zmiany na żywo.

Czy ten artykuł okazał się pomocny?
Niniejszy formularz służy wyłącznie do przekazywania opinii dotyczących dokumentacji. Dowiedz się, jak uzyskać pomoc dotyczącą HubSpot.