How to Customize Hubspot form?

SOLVE
Highlighted
New Contributor
  1. Hi.

    I have some problems with customizing the Hubspot form embedded on my website.

    I do follow the Hubspot docs, but something is not quite right.
    (https://developers.hubspot.com/docs/methods/forms/advanced_form_options)

Here is the code itself:

<style>
    
.my-custom-form input {
    border: 4px solid black;
}

</style>


 <div>

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/shell.js"></script>
<script>
hbspt.forms.create({
    portalId: "6402240",
    formId: "c39e10cd-caf3-4853-b412-fef2e723c153",
    cssClass: "my-custom-form"
});
    
</script>

</div>

 

Reply
0 Upvotes
1 Accepted solution

Accepted Solutions
Advisor | Platinum Partner

Hi @amelnyk 

 

Is your form using built-in Hubspot styling or have you enabled "Set as raw HTML form" under the form's style & preview tab?  If the form is not set to raw HTML it loads in an iframe and therefore your internal style can't be applied to the form element within the iframe.


Did my post help answer your query? Help the Community by marking it as a solution.

Matthew Shepherd

An Inbound Growth Agency
Platinum HubSpot Partner

1 Reply 1
Advisor | Platinum Partner

Hi @amelnyk 

 

Is your form using built-in Hubspot styling or have you enabled "Set as raw HTML form" under the form's style & preview tab?  If the form is not set to raw HTML it loads in an iframe and therefore your internal style can't be applied to the form element within the iframe.


Did my post help answer your query? Help the Community by marking it as a solution.

Matthew Shepherd

An Inbound Growth Agency
Platinum HubSpot Partner