Data ostatniej aktualizacji: 5 września 2025
Dostępne z każdą z następujących podpisów, z wyjątkiem miejsc, w których zaznaczono:
Po utworzeniu formularza w HubSpot można dodać go do stron HubSpot lub stron utworzonych poza HubSpot. Jeśli Twoje treści są hostowane poza HubSpot, możesz dodawać formularze za pomocą następujących metod:
- Osadzić formularz, kopiując kod osadzania i dodając go do strony zewnętrznej.
- Użyj linku udostępniania formularza, który oferuje samodzielną stronę internetową dla formularza, do której można utworzyć link.
W przypadku obu metod zmiany wprowadzone w formularzu zostaną automatycznie zaktualizowane w formularzu na żywo w witrynie zewnętrznej. Osadzony formularz HubSpot można stylizować w edytorze formularzy lub za pomocą CSS w zewnętrznym arkuszu stylów.
Zanim zaczniesz
- Jeśli chcesz ustawić swój formularz jako surowy formularz HTML, ta opcja nie jest dostępna w zaktualizowanym edytorze formularzy. Tylko formularze utworzone przy użyciu starszego edyt ora formularzy mogą być ustawione jako surowy HTML.
- Jeśli osadzasz formularz HubSpot na zewnętrznej stronie, musisz zainstalować kod śledzeniaHubSpot , aby śledzić dane analityczne. Dowiedz się, jak zainstalować kod śledzenia HubSpot.
Styl formularza
Dostosuj tekst, pola wprowadzania, przycisk i tło formularza i kroków formularza. Opcje stylu skonfigurowane na karcie Globalny styl zostaną zastosowane do wszystkich kroków formularza. Nie można osobno stylizować poszczególnych kroków formularza.
- Na koncie HubSpot przejdź do sekcji Marketing > Formularze.
- Utwórz nowy formularz lub najedź kursorem na istniejący formularz i kliknij Edytuj.
- W menu na lewym pasku bocznym kliknij ikonę Styling.
- Można dostosować styl dla następujących elementów formularza:
- Pola: dostosuj pole, w tym tło i obramowanie. Można również dostosować czcionkę, rozmiar czcionki i kolory etykiet, a także kolory tekstu pomocy, symboli zastępczych i tekstu błędu.
- Przyciski: dostosuj wysokość przycisku, zaokrąglenie narożników, tło, gradient i dodaj cień do przycisku. Możesz także dostosować czcionkę, rozmiar czcionki i kolor tekstu przycisku.
- Akapit (tekst sformatowany): dostosuj czcionkę, rozmiar czcionki i kolor tekstu głównego.
- Nagłówek : dostosuj czcionkę i kolor tekstu nagłówka. Możesz dodać cień do tekstu nagłówka.
- Tło: dostosuj tło formularza i kroków formularza. Możesz ustawić kolor tła lub użyć obrazu jako tła. Do generowania obrazów można użyć asystentów AI. Możesz także ustawić obramowanie formularza.
- Pasek postępu: dostosuj pasek postępu w formularzu, w tym kolor linii postępu i czcionkę paska postępu.
Skopiuj kod osadzania formularza
Formularz HubSpot można osadzić na stronie zewnętrznej, kopiując kod osadzania formularza i wklejając go na stronie zewnętrznej. Aby śledzić analitykę dla osadzonego formularza, kod śledzenia HubSpot musi być zainstalowany na zewnętrznej stronie, na której osadzono formularz HubSpot.
Aby uzyskać dostęp do kodu osadzania:
- Na koncie HubSpot przejdź do sekcji Marketing > Formularze..
- Najedź kursorem na formularz i kliknij Edytuj.
- W prawym górnym rogu kliknij Przejrzyj i zaktualizuj.
- W prawym panelu u dołu kliknij Aktualizuj.
- W oknie dialogowym kliknij Pobierz kod osadzania.
- Na karcie Kod do osadzenia kliknij Kopiuj.
- Wklej kod osadzania do modułu HTML na stronie zewnętrznej.
Użyj linku udostępniania, aby udostępnić samodzielną stronę formularza
Możesz udostępnić swój formularz za pomocą linku udostępniania, który wyświetli formularz na samodzielnej stronie internetowej. Tego linku udostępniania nie można ukryć ani uczynić prywatnym. Każda osoba posiadająca łącze udostępniania będzie mogła uzyskać dostęp do formularza.
Aby uzyskać dostęp do łącza udostępniania:
- Na koncie HubSpot przejdź do sekcji Marketing > Formularze..
- Najedź kursorem na formularz i kliknij Edytuj.
- W prawym górnym rogu kliknij opcję Przejrzyj i zaktualizuj.
- W prawym panelu na dole kliknij Aktualizuj.
- W oknie dialogowym kliknij opcję Kopiuj łącze udostępniania.
- Na dole kliknij Kopiuj. Spowoduje to skopiowanie adresu internetowego strony formularza do schowka.
- W przeglądarce otwórz nowe okno lub kartę i wklej adres URL strony formularza w pasku adresu, aby go załadować. Możesz również udostępnić adres URL strony formularza bezpośrednio innym osobom, aby dać im dostęp do formularza.
Styl osadzonego formularza za pomocą CSS w zewnętrznym arkuszu stylów
Użytkownicy kont Marketing Hub, Content Hub Professional lub Enterprise mogą osadzać formularze i stylizować je za pomocą CSS w zewnętrznym arkuszu stylów. Dzięki tej metodzie można zastąpić domyślne style, zastosować szczegółową stylizację do określonych elementów formularza i ustawić globalne reguły dla spójnej stylizacji we wszystkich osadzonych formularzach. Dowiedz się więcej o tym, jak zdefiniować niestandardową stylizację dla osadzonych formularzy za pomocą CSS.
Aby uzyskać dostęp do kodu deweloperskiego:
- Na koncie HubSpot przejdź do sekcji Marketing > Formularze..
- Najedź kursorem na formularz i kliknij Edytuj.
- W prawym górnym rogu kliknij Przeglądaj i aktualizuj.
- W prawym panelu na dole kliknij przycisk Aktualizuj.
- W oknie dialogowym kliknij Pobierz kod osadzania.
- Kliknij kartę Kod deweloperski (Zaawansowane).
- Aby zaakceptować ryzyko, że zmiany wprowadzone zewnętrznie w CSS lub JavaScript mogą spowodować uszkodzenie formularza, zaznacz pole wyboru Rozumiem ryzyko, pokaż mi kod.
- Na dole kliknij przycisk Kopiuj.
- Dodaj kod osadzania formularza do strony zewnętrznej. Po osadzeniu formularza będziesz mógł nadać mu styl w zewnętrznym arkuszu stylów za pomocą CSS.
- Zmienne CSS, które można zastąpić, są wymienione w tym artykule .
- Style globalne zastąpią stylizację najwyższego poziomu we wszystkich osadzonych formularzach. Możesz także kierować reklamy na poszczególne elementy formularzy, takie jak wiersz elementu formularza, przyciski przesyłania lub nagłówki formularzy.
