How can we help? 👋

How to inject custom code in my form?

Discover how to use our custom code feature

Last updated on December 10, 2021

One of our Pro features is the injection of custom code within your forms. There's no limit on what you can do with your own CSS and your own scripts. Add an analytics script or even a live chat on your form page.

 

To add custom code, in the form editor go to the "Custom Code" section, and use the code input to put your code. It will be injected of the <head> section of the page. Note that code changes and preview can only be previewed on the public page of your form.

 

Here's a first example you can use to center your logo on a form page:

<style>
img.w-20.h-20.absolute.left-5.top-5 {
	left: 50% !important;
    transform: translateX(-50%);
}
</style> 
 

Here's another more advanced code sample that can be used to customize the appearance of the form, by applying new CSS rules:

<style>
body h1, body p, body input, body label {
	font-family: Lato, sans-serif !important;
}

label.font-bold {
	font-weight: 500! important;
}

.rounded-lg {
	border-radius: 4px !important;
}
.relative.mb-3 {
	margin-top: 30px;
}
.shadow-sm {
	box-shadow: none !important;
}
.border {
	border-color: #b8bdc9 !important;
}
</style>
Did this answer your question?
😞
😐
🤩