🥳 Celebrate Our Launch With a $200 LIFETIME Discount OFF The Premium Plan Use: BIRTHDAY2024

This offer expires 9/30/2024, at 11:59 PM EST

BizStackPro all-in-one digital marketing platform dashboard.
Images in Forms – BizStackPro Help

BizStackPro Forms Help Guide

Images in Forms

Add background images, header images, and inline image elements to make your BizStackPro forms more branded, polished, and engaging.

Quick Answer

How can you add images to a BizStackPro form?

You can add an inline Image element inside the Form Builder, set a background image under Styles → Colors & Background, or add a header image through the form's Styles options. Save and preview the form after making changes.

Improving Form Design With Visual Elements

You may be collecting information through forms, but design plays a big role in how users interact with them.

Adding images can help reinforce your brand, guide attention, and make your forms feel more polished.

Without visual elements, forms can feel plain or less engaging.

This guide shows you how to use images so your forms are visually consistent and easier for users to complete.

Three ways to use images

BizStackPro forms can use inline image elements, background images, and header images depending on how you want the visual to appear.

Images in Forms at a Glance

Inline Visual Image Element
Background Colors & Background
Top of Form Header Image
Image Controls Size & Alignment
Final Check Save & Preview

Before You Begin

Have the image you want to use ready before opening the form in the Builder. Optimized images can help keep the form loading quickly.

Why Add Images to Forms?

Brand Consistency

Match the form to the style of your website or funnel.

Better First Impression

Header images can help set the tone as soon as someone opens the form.

More Engagement

Visuals can help keep users interested and reduce drop-off.

Clearer Communication

Use images to support instructions or highlight offers inside the form.

Optimize images before uploading

Use compressed, web-optimized images so your forms continue to load quickly, especially on mobile devices.

Add an Image Element Inside a Form

Step 1: Open the Form Builder

Go to Sites → Forms and open the Builder.

Step 2: Open or Create the Form

Create a new form or open an existing form to edit.

Step 3: Add the Image Element

Click + Add Form Element and drag an Image element into the form.

Step 4: Adjust the Image

Select the image element and use the available controls to adjust its alignment and size.

Step 5: Save and Preview

Save and Preview the form to confirm the image looks right.

Inline image example

Use an inline image to add a logo, banner, or supporting graphic near important questions.

Set a Background Image

Step 1: Open the Form

Open your form in the Builder.

Step 2: Open Background Settings

Go to Styles → Colors & Background.

Step 3: Choose the Image

Upload or select the background image you want to use.

Step 4: Preview the Form

Preview the form and make sure the text remains easy to read over the background.

Protect readability

If the background makes form content difficult to read, use a simpler image, add more contrast, or reduce the background intensity.

Add a Header Image

Step 1: Open the Form

Open the form in the Builder.

Step 2: Open Styles

Go to Styles and locate the header image option.

Step 3: Choose the Header Image

Upload or select the image you want displayed at the top of the form.

Step 4: Save and Preview

Save and preview the form to confirm the header image displays correctly.

Best Practices

Optimize Files

Resize and compress images before uploading them.

Stay on Brand

Use consistent colors, fonts, and imagery across your funnel.

Test on Mobile

Confirm images do not push important form fields too far down the page.

Keep It Clean

Avoid overly busy backgrounds that compete with the form content.

Frequently Asked Questions

Can I use both background and header images in the same form?

Yes. You can add a header image and also set a background image to create a more branded, visually engaging form.

What image formats are supported for forms?

Common formats like JPEG and PNG are typically supported. Use optimized images to keep your form loading quickly.

How do I adjust image size and alignment?

Select the image element inside the builder, then use the image resizing and alignment controls to set width and alignment.

Will adding images affect loading speed?

It can. Large image files may slow loading, so compress and resize images before uploading.

Continue Learning

Continue with related Forms guides for adding helpful content, customizing your form design, and building the rest of the form experience.

Recommended Next Step

Continue Customizing Your Form

After adding images, continue with the form customization guide to review the other styling options available for your form.

Make Every Form Feel On-Brand

Header images can build trust quickly, background images add style, and a clean layout helps keep users focused on completing the form.

Disclaimer: This site is NOT endorsed by Google, Facebook or YouTube in ANY WAY. All trademarks & Logo / branding are the property of their respective owners. Please Note: This site was created in BizStackPro by Ken George II (An Affiliate of BizStackPro) and may contain affiliate links.

All About BizStackpro


Copyrights 2024 | AllAboutBizStackPro.Com | Pricing | About | Features | All Rights Reserved.