In many cases you might want these custom sections toggled OFF. Simplicity is an important aspect of successful fundraising campaigns! The custom body section can contain a full width background image or color, text, and HTML.

 

1. To access the Custom Body Editing Modal, roll your mouse over the custom body area inside your Site Editor. 

This will reveal the section editing toolkit in the right top of the section. Click on any tool to open the editing modal. NOTE: There are two custom body areas on your homepage.

 

2. This opens the section editing modal. Here you can edit every aspect of the custom section.

Custom body editing tabs

There are 2 tabs on the custom body editing modal: Design and Text/HTML.

DESIGN
Customize the overall design of the custom body section.

Text/HTML
Customize the custom body area with your own text, images, or whatever your want. Advanced users can customize body sections with their own HTML.

 

Design Controls

 

Custom section visibility
Toggle ON or OFF the custom section. Remember: These sections are optional and only there for you if you need them. In many cases, you’ll want to leave these sections OFF.

Text/HTML Container Width
This is the width of the Text/HTML container. While your background image is always full width, the text container can be sized to meet your needs. It’s generally best to use “Max Width 1170px” unless you are working with your own custom HTML. 

Text/HTML Content box width
This controls the width of the Text/HTML content. This may seem confusing, but it’s common web layout strategy. Think of it like this: The CONTENT is inside the CONTAINER. Your container can either extend full-width or max out at 1170px. Your content can then further be specified to take up a percentage of that container. This allows you an incredible amount of flexibility within your Text/HTML design and layout.

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

Background color
Set a 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.

Media vertical alignment
Control the vertical alignment of your background image. Align the background image to the top, center, or bottom of the section. Vertical and horizontal alignment settigns can be used together to keep a particular part of your image in view for different screen sizes.

Media horizontal alignment
Control the horizontal alignment of your background image. Align the background image to the left, center, or right of the section. Vertical and horizontal alignment settings can be used together to keep a particular part of your image in view for different screen sizes.

Top padding
Add padding to the top of the Text/HTML container.

Bottom padding
Add padding to the bottom of the Text/HTML container.

 

Text/HTML Controls

Use the text WSYWIG Editor to style and customize your text. This works similar to formatting text in a word document.You can also add images to this editor! For maximum control of your design, you can access the HTML editor at the bottom left of this modal, click “HTML Editor” to switch editing modes.

 

 

Did this answer your question?