Form Builder: Image Styling

Purpose: Kizen's Form Builder allows you to customize the sizing & position of images within Forms

TABLE OF CONTENTS

• Customize your image
• Row Size Adjustment

Customize your image

1. Click on an Image

2. In Image Settings, located in the righthand bar are Image Styling options

3. Click into Size to choose between Auto & Custom for the Image

    3.1 Selecting Auto will automatically adjust the image size
    3.2 Selecting Custom allows the ability to adjust the size of the image in one of two ways:

4.1 Unit PX allows us to enter a specific value for Max-width and Max-height

4.2 %: setting will notate the max width for the image

5. Adjust the Position (Left, Center, Right) of where the image sits in the Form

6. Add a link to the Image by enabling the Has Link toggle and pasting in your link

Row Size Adjustment

Kizen's Form builder also allows you to adjust the size of Form rows. To achieve this, follow the steps below:

1. Select Row, which will automatically take you to 

2. Row Settings in the righthand bar

    2.1 Width(%) - Adjust the row size by notating a percentage of the Max Width (i.e., 1/2 row = 50%)

    2.2 Max Width (px): Notate a specific value for the row size

    2.3 Alignment: Left, Center, Right

Hint: Spacing is applied to the component (i.e., between Rows & Sections) and not content within the element. As you customize your Form, click Save & Preview for a preview of what you've built