Formstack

Editing the Header & Footer



Editing the Header and the Footer of a form sends a powerful message about the purpose of your form. We have now made building and branding forms more streamlined by allowing you to easily add images to the Header or Footer.



To add a header or footer image click the "Theme" button in the bottom left corner of the builder. If you're using a stock theme you'll need to first edit the theme before the header and footer image areas appear above and below your form in the builder.



Once the "Add a Header" or "Add a Footer" area is clicked, the option to choose an image to upload will appear along with the option to set the size of the image, and align the image to the left, center, or right side of the page.

ProTip: We recommend an image with a width of 700px for the best fit.

Once you've added your header image make sure to save your theme before you preview your live form.

Note: Images uploaded in Jpeg format are compressed by our system at about 80% quality. If you're noticing a drop in image quality, this might be why. We suggest using a lossless image format such as PNG or GIF to not experience this quality loss.


Removing the Header or Footer Image




To remove a header or footer image you've added to your theme click on "Edit Header" under the image, then on "Remove Image" to the right of the image. Finally, save your theme to apply the change.

Note: Header and footer images do not show up when embedding your form using the javascript embed code as they are not part of the form body. The images will, however, show using the iframe embed code.

 

Editing Header/Footer HTML 




When on the Themes tab at the bottom left side of the page, click on the "Advanced Code Editor" to expand the view of it. When it is expanded there will be buttons for "Header HTML" and "Footer HTML" click on the one one you would like to edit and you could put in custom code, or below them there is an option to put in the default header or footer code.

Warning: Editing the HTML/CSS in the Header or Footer will wipe out any styling by the Theme or Advanced CSS applied to the theme.