Updated Aug 16, 2023
Dubsado forms are highly customizable, but you can take them even further with custom code! This article covers two methods for adding custom code to your form and when to use each one.
Add CSS to style your form
CSS (Cascading Style Sheets) is a powerful and efficient way to change the appearance of elements on your form. This is especially helpful if you’ll be embedding your lead capture or public proposal and want to match the look and feel of your website.
With CSS you can:
use a custom font
quickly style all the headings and body text on your form
change the appearance of the question fields
change the appearance of the submit button
To add CSS to a form, go to Templates >> Forms and select your form. Then click Form styling (palette icon) >> Edit CSS. This is where you can manage all the CSS for your form in one place. Our CSS cheat sheet can help you jump start your styles!
👋 Here’s a tip... want to give CSS a try but don’t know where to start? Check out this article from the Mozilla Developer Network.
Add an HTML block to insert custom content
The HTML block allows you to insert your own custom content on a Dubsado form. HTML blocks are available on questionnaires, proposals, and lead captures. For security reasons, they cannot be used on contracts or sub agreements.
You could add unique content that you code from scratch. For example, an interactive image gallery, an animated testimonial slider, or custom buttons or links.
You can also insert embeddable content, such as hosted videos (YouTube, Vimeo, etc.), a Google map, or a spreadsheet. If you have any questions on embedding content, please reach out directly to the service you want to be embedded in a form. Dubsado is not able to provide specific customer support .
Can I add CSS to the HTML block?
Technically, yes. The HTML block supports
<style> tags. However, we recommend using the dedicated CSS editor in the Form styling settings for all your CSS. This will keep your code cleaner and much easier to manage with all the CSS in one place!
Will Dubsado ever make changes to forms that affect my custom code?
Our team is dedicated to bringing you as many features and updates as possible to empower you to design beautiful forms without needing to know how to code. From time to time, the changes we make to introduce these new features may impact the custom code on your forms.
While we aren't able to guarantee permanent support for all CSS, we can ensure that any of the CSS demonstrated in our cheat sheet will be supported long-term. Dubsado cannot guarantee that custom code beyond what is shared in this article will not be impacted by future updates to our form builder and client view.