Common design adjustments for pages

Article author
Kelly Sutter

All of our pages have a similar design by default, but they are completely customizable. Here are some of the common design adjustments you may want to make.

 

Images

To update your logo or banner

You can use an image of any size. Our placeholder image is a 600x350px transparent PNG. The butterfly logo is centered inside the image and has lots of whitespace around it.

After you update the logo and styles in your first page, click the Import icon on your other pages and drop the banner into the page. Alternatively, you can save the container as a Custom Block that can be dropped in on the other pages.

pages-import.jpg

 

To make the logo bigger (or smaller)

  1. Click on the Image block
  2. Click on Styles
  3. Open the Widths section
  4. Enter `350px` into the Max Width field or whatever width you desire

To align the image left or right

  1. Click on the Container block that the image sits in
  2. Click on Styles, next to the Content link
  3. Open the top Block Container
  4. In the Spacing section, enter `auto` into the left and right Margin Fields
  5. Expand the Widths section and enter `730px` into to the Max Width Field
  6. Click on the Image block
  7. Click on Styles
  8. In the Spacing section, enter 0px in the left Margin field (to align image left) or in the right Margin field (to align image right)

To make the image stretch across the width of the form

  1. Click on the Image block
  2. Click on Styles, next to the Content link
  3. Open the top Block Container
  4. Open the Widths section
  5. Enter `700px` into the Max Width field
  6. Upload an image that is at least 700px wide. It can be any height.

To make the image stretch across the width of the page

  1. Click on the Image block
  2. Click on Styles, next to the Content link
  3. Open the top Block Container
  4. Open the Widths section
  5. Enter `100%` into the Max Width field
  6. Upload an image that is at least 1000px wide. It can be any height.

 

Colors and fonts

To change the font and text color

  1. Click on Stylesheet
  2. Click on General Styles
  3. Click on Base
  4. Change the Font Family

To change the button colors

  1. Click on the button
  2. Click Styles
  3. In the Submit Button section, enter or select your Background Color

To change the container background color

  1. Click on the Container surrounding the image
  2. Click on Styles
  3. In the Block Container section, enter or select your Background Color