Overwrite some HubSpot form tags on an external website

Developer Support APIs & Integrations
1

Hello,

I’m using a HubSpot form in our website, and I would like to overwrite some existing styles (e.g. the confirmation message), but not all of them.

The built-in customization in the HS form edition is too limited for my goal.

I know that we can use a raw HTML form, but that’s overkill and I would prefer to keep the vanilla HS style and only overwriting what is needed for maintainability sake.

There is a cssClass attribute available for form creation, but it’s not taken in account with a non-raw HTML form.

I tried to directly target the wanted classes in my CSS, but it’s not reachable because of the form being in an iframe.

Is there any way to do this? I’m sure I’m not the first guy looking for that customization.

2

Hi @MonsieurNebo

This is currently expected behaviour and is what is expected when working with a non-raw html rendered form. The form itself is rendered in an iFrame and the styling applied by the Form Editor tool within your Portal.

Once it is rendered in this manner, it cannot be altered by the form classes that are added when it is rendered as a raw html form.

If you wish to apply some customisation, you will need to work with the raw html variant instead.

I hope this helps!

3

Hello @Willson ,

I switched to raw HTML and restyled the whole form myself then.

Thanks for the answer.