Row background options

1

To access row settings first active the page builder on the page you'd like to edit. Then put your mouse on the row next at the top left put your mouse on the settings icon and click row settings from the dropdown menu.

In the settings window that opens, scroll down to the background options.

Note: All these examples are rows with three columns. The number is in the first column. This text is in the middle column and the photo is in the 3rd column. The background works the same no matter how many columns the row has but if you are new to rows and columns I hope this gives you an idea of how to arrange content in rows and columns.

Snag_105c57f1

2

On this row this background type is set to color and the color is set to this blue color.

Snag_15999adb

3

On this row this background type is set to gradient.

  • By default, it's set to linear gradient, which creates a straight fade from one color to another. The "90" shown in the image indicates the angle—you can adjust this value to change the direction of the gradient. Alternatively, you can select a radial gradient, where the color starts from the center and radiates outward in all directions.
  • You can choose two colors: a starting color and an ending color. The percentage values control where the color transition begins. For example, if you want a solid color for the first 50% of the row, change the "0" to "50"—this will display the starting color as solid for the first half, then fade into the second color.
Snag_159dc071

4

On this row this background type is set to photo. Below the background section in the setting is a color overlay option. We also added a black color overlay set to 50% transparent to darken the image some so you could more easily read this text.

Snag_15aa9a8a

5

This row uses a video background type. You have two options for adding video:

  1. Media Library: Upload a video directly to your site. Note that videos must be under 100MB for this option.
    Embed Code: Embed a video of any size from services like YouTube or Vimeo.
  2. Important: If you're uploading a video, be sure to use an MP4 file. All browsers support MP4 format, while WebM support is not universal.
Snag_15b4d09d

6

This row uses a slideshow background type.

Under photos you have two options.

  1. Edit Gallery click this to remove photos or Drag and drop photos to change the order.
  2. Add Photos click that to add new photos to the slideshow.

You have lots of transition options. In this example, we are using the ken burns option that adds some movement to the background.

Snag_15ceba29

7

This row uses a Parallax background type. Parallax creates a visual effect where the background image moves at a different speed than the rest of the page content as you scroll. This creates a sense of depth and makes your website feel more dynamic and engaging—almost like looking through layers. It's a popular design technique that adds a modern, professional touch to websites.

Snag_15d3caf9

Still need help?

New Our Church app Search Screen
Add your logo!

Add your logo in the admin
area of your website at:

Mobile App > App Settings

It's the search logo option.

Note: Allow 24 hours for
your logo to show on the
app search screen.