To grab attention to your board in a dynamic and flexible layout, use the designer to create a visually stimulating Split Banner design. The Split Banner section is divided into two side by side sections. On each side, you can add an image, form, video or text section. 

Before you begin:

• Choose images to use in the Split Banner section.
• The maximum file size for images is 25 MB.
• The following image file types are supported: png, jpg, jpeg, gif, svg, svg+xml, ico, x-icon, webp
• The recommended dimensions for images in the Split Banner section is as follows: Image width no smaller than 750px (preferably this exact width). There is no fixed ratio.
• See the Image Size Guidelines for more details on image sizing.  

Here are a few ways to use the Split Banner section: 

• Split the banner section into Text and Image sections  
• Add a form or video to the Split Banner section.

Designing a Split Banner Section  

After adding a Split Banner section, you can design the different elements of the section. 

1. Select the board on which you wish to add a Split Banner section and open the Designer.    
2. Hover over the border between sections where you want to add the section and click Add Section. The Section Gallery opens and displays the section types. 
3. Select Banner from the section menu. Then, select the Split Banner template.
4. Click Add Section. The new section appears on your board for you to design.
5. To design the Split Banner section, choose one of the section editors.  

• • Split Banner section editor - design the overall look of the section.
  • Background editor - edit background settings, including images, colors and padding
  • Text editor - edit the text side of the section, including title and subtitle
  • Image editor - design the image side
  • Form editor - design the form side
  • Video editor - design the video side 

Using the Split Banner section editor 

Using the Split Banner section editor, you can design the right and left sides of the section, including choosing from text, image, video or form for each side.                  

1. To open the Split Banner section editor, click the edit button on the section toolbar.  

              

2. Choose the side to design: Left or Right.    
3. To swap the positions of the sides, click the arrows icon .
4. Select the Side type: Image, Text, Form, or Video. 

Designing the Image side 

For the Image side, configure the following settings: 

1. Set the Image Size. 
2. Set the Horizontal and Vertical Alignment of the image.
3. To add Animation, open the dropdown.
   1. To add scroll animation, select the checkbox.
   2. To add image animation, select the checkbox. This enables zooming in and out of images when hovering over them.
4. To edit the image settings, click the edit button in the upper right corner of the image.
5. Open the Image gallery to add an image. For more details, read Designing Images.  

Designing the Text side  

For the Text side, configure the following settings:

1. Set the Vertical and Horizontal alignment.
2. To show the Title and Subtitle on the text side, enable the eye icon next to it.
3. To show Buttons, enable the eye icon next to it and choose the number of buttons to display.
4. To add Animation, select the checkboxes.
5. To edit the text, hover over the title, subtitle or button and click the text edit button.

6. Use the text editor to format the text. For more details, see Using the Text Editor.
7. To design the CTA button, hover over the button and click the edit button.
8. To style the button elements, see Designing Call-to-action buttons. 

Designing the Form side

For the Form side, configure the following settings: 

1. Set the Vertical and Horizontal alignment.
2. To add Animation, select the checkboxes.
3. To edit the form settings, hover over the form and click the form edit button.
4. Click on the form and choose the type of form:

• • Form
  • Registration
  • Add a new form

 

To learn more about creating forms, read the article Designing Buttons and Forms. 

Designing the Video side

For the Video side, configure the following settings: 

1. To choose a video, click Select Item and select a video from the list. Then, click Save Changes. 
2. Set the Video Size.
3. Set the Horizontal and Vertical Alignment of the image.  
4. To have the video autoplay, turn on the toggle. 
5. To show the video in the placeholder, enable Preview Image.
    

Designing the section background 

You can design the background with a unique background color, image or video and update padding settings. 

1. To open the background editor, click the background edit button on the Text and Image section toolbar.   
2. To edit the background elements, see the article Using the Background Editor.