The Banner field is where you can upload a large image or video and include text overlay, color gradients and more. This is commonly used towards the top of pages to beautifully feature a video or image, the name of your organization or cause, and additional details.
Learn how to upload your image or video and apply your desired effects below.
Jump To...
Add a Banner Field
From the Pages screen, click the pencil icon on the page you want to edit
Scroll to find the faintly dotted line, just above the donation section
Hover your mouse over that line and click the green + icon
Select the Banner field
Pro Tip: Users can also add a Banner to the donation section of the page, although this is less common.
Customize Your Banner
Background Type: Select the background type you would like to add to your banner
Image: Click Choose Image to select your banner image. Choose to Upload your own image or a previously uploaded image, use one of our photos, or browse patterns & textures.
Color: Click the color circle and select the desired color, or manually add a color hex you would like. Make the color more or less opaque by adjusting the opacity slider under the color slider
Video: Paste your video URL into the text field
Transparent: Add a transparent banner where you can highlight the background and add custom text
Add Effect (available with an image and video background): Add a blur, grayscale, sepia, saturation, or brightness effect to your image or video. Move the slider to adjust the intensity of the effect
Color Overlay (available with an image and video background): Toggle On if you would like to overlay your image or video with a color. When this option is turned on, click the color circle and select the desired color, or manually add a color hex you would like. Make the color more or less opaque by adjusting the opacity slider under the color slider
Position (available with an image background): Select where you would like the image to be positioned in the banner
Width: Check the checkbox to make the background extend to the full width of the page
Minimum Height: Adjust the slider to set the minimum height of the banner
Mobile Settings: Toggle on Mobile Settings if you would like to banner to be more mobile compatible. If this option is selected, set the minimum height of the banner on mobile
Add Text to Your Banner
Standard Option
Text Type: Click Standard
Text Alignment: Set your text to align to the left, the center, or the right on the banner
Add any text to the banner. Users can customize the font, font size, the font color, and font styling (bold or italics)
Click Add Text to add additional text
Click Make Text Full Width to make the text extend to the full width of the banner
Custom WYSIWYG Option
Text Type: Click Custom WYSIWYG
Add your text. Format the text using the menu bar options
Click Make Text Full Width to make the text extend to the full width of the banner