Stijl uw embedded HubSpot formulier op uw externe pagina's op twee manieren in de formulier editor of met CSS in uw externe stylesheet.
In de formulier-editor
Thema
Als u uw formulieren wilt stijlen zonder een aangepaste code te schrijven, kunt u vooraf ingestelde thema's toepassen op uw ingebedde formulier of zelfstandige formulierpagina. De thema's voegen meer aanpassingsmogelijkheden toe aan uw formulieren, naast de eventuele globale formulierstijlinstellingen.
- Klik op de naam van een formulier.
- Klik in de formulier-editor op het tabblad Stijl & Preview.
- In het linkervakje, de Thema-sectie, maak het vakje leeg.Houd het oude thema aan.
Let op: het verwijderen van de Keep old theme checkbox zal de oude standaard HubSpot styling die op dit formulier is toegepast verwijderen. Elke aangepaste CSS of JavaScript die u hebt toegevoegd aan het formulier zal niet langer werken. Dit selectievakje is alleen beschikbaar voor oude formulieren en zal niet beschikbaar zijn in nieuwe formulieren die in uw account zijn aangemaakt.
- Selecteer een van de vier thema's.
Stijl(Marketing Hub Starter, Professional, Enterprise of Legacy Marketing Hub Alleen Basic )
Naast thema's kunt u ook ingebedde vormen op een meer korrelig niveau stileren.
- Klik op de naam van een formulier.
- Klik in de formulier-editor op hettabblad Style & Preview .
- Klik in het linkerdeelvenster op de sectie > Stijl om deze uit te breiden. Hier kunt u de breedte van het formulierveld, de lettertypefamilie, de lettergrootte, de lettertypekleuren en de formulierknop stijlen.
Deze stijlen zijn ingesteld op een individuele formulierbasis en zullen de globale vormstijlinstellingen overschrijven.
Let op: de thema's en stijlen die in de formulier-editor zijn ingesteld, zijn alleen van toepassing op ingesloten formulieren of zelfstandige formulierpagina's. Formulieren op uw HubSpot pagina's kunnen alleen worden gestyled met de stijlopties van de formuliermodule in de content editor.
Met CSS in uw externe stylesheet (Marketing Hub Professional, Enterprise of Legacy Marketing Hub Basic only)
- Klik op de naam van het formulier.
- Klik in de formulier-editor op het tabblad Stijl & Voorvertoning.
- Klik op om de Set als onbewerkte HTML-formulier in te schakelen. Het formulier zal worden weergegeven als een ruw HTML-element op uw externe pagina in tegenstelling tot binnen een iframe, en elke standaard HubSpot styling toegepast op het formulier zal worden verwijderd.
- Klik rechtsboven op Delen.
- Klik in het dialoogvenster op Kopiëren om de insluitcode van het formulier te kopiëren.
- Voeg de insluitingscode van het formulier toe aan uw externe pagina. Als u uw formulier al hebt ingesloten, moet u de bestaande insluitingscode vervangen door deze nieuwe, niet-gestileerde versie.
- Nadat u uw formulier hebt ingesloten, kunt u het formulier in uw externe stylesheet stijlen met CSS.
- U kunt ook de insluitingscode van het formulier wijzigen om extra aanpassingen aan het formulier te maken. Aangezien HubSpot formulieren zijn gebouwd met JavaScript, niet met HTML,kunt u de insluitcode van het formulier aanpassen. heeft de hulp nodig van een ontwikkelaar die weet hoe hij met JavaScript moet werken.