Wyśrodkuj formularz na szablonie HubSpot

Możesz wyśrodkować formularz na szablonie HubSpot, używając poziomych modułów dystansowych lub niestandardowego CSS.

Używanie poziomych modułów dystansowych

• Na swoim koncie HubSpot przejdź do Treści > Design Manager.
• Kliknij nazwę szablonu w wyszukiwarce, aby go edytować.
• W inspektorze po prawej stronie kliknij+Dodaj, aby wstawić dwa nowe poziome moduły dystansowe; jeden po lewej, a drugi po prawej stronie modułu formularza.

Używanie niestandardowego CSS

• Na swoim koncie HubSpot przejdź do Treści > Design Manager.
• W wyszukiwarce, kliknijoszukaj swójplik CSSw obrębie folderów, a następnie kliknij go, aby zaznaczyć go w edytorze.
• Dodaj następujący kod do wyśrodkowania all swoich formularzy na całej stronie:

/* Aby wyśrodkować formularz w obrębie jego modułu i zastosować maksymalną szerokość */
form.hs-form, .hs_cos_wrapper .form-title {
max-width: 600px;
display: block;
margin: 0 auto;
}

/* Aby wyśrodkować tytuł formularza w module formularza */
.hs_cos_wrapper .form-title {
text-align: center;
}

/* Aby wyśrodkować przycisk wysyłania formularza */
.hs_submit {
   text-align: center;
}

• Jeśli chcesz wyśrodkować określone formularze, możesz dodaćniestandardową klasę do swojego modułu formularzyw swoim szablonie, a następnie dostosować swój CSS, aby stosował się tylko do modułów z tą klasą. Na przykład, jeśli dodasz niestandardową klasę center-form do modułu formularzy w swoim szablonie, Twój CSS będzie wyglądał tak:

/* Aby wyśrodkować formularz w obrębie jego modułu i zastosować maksymalną szerokość */
form.hs-form, .center-form .hs_cos_wrapper .form-title{
max-width: 600px;
display: block;
margin: 0 auto;
}

/* Aby wyśrodkować tytuł formularza w obrębie modułu formularza */
.center-form .hs_cos_wrapper .form-title{
text-align: center;
}

/* Aby wyśrodkować przycisk wysyłania formularza */
.center-form .hs_submit{
   text-align: center;
}

• W prawym górnym rogu kliknij przyciskOpublikuj zmiany.