Editing Use HTML and CSS with your forms (section)

== Step-by-Step Instructions ==

=== Using HTML ===
The HTML block can be added to customize specific parts of your form.

1. From the Form Builder, click on '''Fields''' > '''Contact Fields'''.
2. Drag the '''HTML Code''' block to your form layout.
3. Click the '''HTML Block''' on your form layout to activate it.
4. The right pane will then display sample text and HTML code. Here, you can type or paste your desired code into this box.

As you input the code, you will immediately see the text and formatting applied within the block on your form layout.

=== Using CSS ===
To modify visual elements of your form using CSS, follow these steps:

1. Click the '''CSS''' button located on the top right toolbar of the Form Builder.
2. A custom input panel will appear at the bottom of the Form Builder screen.
3. Hover and click on elements within your form; this will open the element-specific sidebar.
4. Click the '''Inspector''' button, and then select the element on the form you want to isolate.
5. Input your custom CSS into the custom input panel provided.
6. To exit Inspector mode, click the '''Inspector''' button again.
7. To close the code overlay on your form, click the '''CSS''' button on top of the builder.