How to add CSS to Form?

Develop, Build & Integrate CMS Development
1

Hi, how to overwrite the css on my form?, I followed the tutorials but not working, this is my code

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta http-equiv="X-UA-Compatible" content="ie=edge">
 <title>Test</title>
 <style>
 .hs-form input[type="text"] {
 background: #FFF222 !important;
 }

 .hs-button-reset,
 .hs-form .hs-button {
 background: #FFF222;
 border: none;
 font-family: Helvetica, Arial, sans-serif;
 line-height: 1;
 margin: 0;
 outline: 0;
 padding: 0;

 }

 </style>
</head>
<body>

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/shell.js"></script>
<script>
 hbspt.forms.create({
	portalId: "4566994",
	formId: "c0179cbd-fd03-4d55-a416-b85e189cbe4d",
 css:""
});
</script>

</body>
</html>

I follow this article but not showing the checkbox Include default styling.

I’m doing something wrong?

2

I checked the forms on my portal. When you go to contacts → forms in your Hubspot portal, then click ‘action’ next to a form and choose ‘embed form’ a popup appears with the embed code. below the code is the check box.

are you using embeds on an external site or a hubspot hosted site?

3

Indeed go to the form > actions > embed code and add the lines from the example as well if they are not there:

<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
 hbspt.forms.create({
	portalId: "#",
	formId: "#",
 submitButtonClass: '#',
 css: ' ',
 cssClass: '#',
});
</script>

Portal and form Id are already filled in.

SubmitButtonClass: add the class of the button

css: ‘’ makes sure that the default css is disabled

cssClass: add 1 class (2 won’t work is my experience, but if you succeed please let me know).

4

Thank you so much!
16x16_heart.png.png
,

5

I am having issue that it’s show
“[]Unsupported context key: className”
I am passing down className as a prop into

cssClass

as there are a few forms sharing the same script with different styling and form Id
Do you know what may cause the issue?
Thank you.