To access the Top Banner Editing Modal

1. Roll your mouse over the top banner area inside your Campaign Site Editor to reveal the section editing toolkit. Click on any tool to open the editing fly-out.

2. In the fly-out, you can edit every aspect of the top banner area.

Top Banner editing tabs

There are 3 tabs on the top banner editing modal: Design, Content and Button.

____

Design Controls

Controls the overall design of the top banner area including background image, headline, text, button, etc.

Background Image: Upload a top banner background image. A background image will override a background color selection.

Banner background color: It’s a good idea to set a background color that is close to your image or brand color. With a slow internet connection, the background color may appear quickly before an image fully loads.

Text/HTML Container Width: While your background image is always full width, the text headline can be sized to meet your needs. It’s generally best to use “Max Width 1170px”.

Text/HTML Content box width: I know this sounds confusing, but think of it like this - The CONTENT is inside the CONTAINER. Your content can be specified to take up a percentage of that container. 

Media vertical & horizontal alignment: Control the vertical & horizontal alignment of your background image. These alignment settigns can be used together to keep a particular part of your image in view for different screen sizes.

Top & Buttom padding: Add padding to the top & bottom of the Text/HTML container.
____

Content Controls

Allows you to customize the top banner area with your own headline. Advanced users can customize the top banner text area with their own HTML!

Use the WSYWIG Editor to style and customize your text. This works similar to formatting text in a word document.

For maximum control of your design, you can access the HTML editor, click "HTML Editor" at the bottom left of the editor:

____

Button Controls

Controls the Donation & Start Fundraising buttons in the top banner. Toggle on the button visibility to start editing.

Donation Button: Add a button text, autofill the donation amount, choose the button & text color and even customize the shape & size. You can also, use this button as a custom link!

Start Fundraising Button: When you're launching a peer-to-peer campaign website, you can toggle on & customize this button! This button will direct supporters to the fundraiser login portal where they can create their own fundraising & team pages.


Did this answer your question?