How to Add Section Layouts on Weebly

Jul 6, 2017 | Weebly Tutorials

In 2016, Weebly released Weebly 4. With this release, Weebly accounts no longer include premade layouts for pages. A new feature that was introduced allows you to use premade layouts for Sections of pages.

How to Add Premade Sections

Sections can be added to new or existing pages. Although most of the premade sections are for business sites, you can modify the text and images for each section type. You can create multiple layouts per page.

Step 1: If you’re starting with a blank page, you can click anywhere on the content area to make the Choose Section Layout window appear. If you are working on an existing page, select the Build tab and then select the Section element. Drag the Section element onto your page.

 

Weebly Section Types

 

Step 2: The Choose Section Layout window includes five types of sections: Gallery, Team, Featured, Menu, and Contact. The example below is a menu section. Notice that it automatically fills the full-width of the page content area.

 

Weebly Section Example

 

Change Text Formatting

When using sections, the fonts and colors used may not coordinate with your existing template. To quickly change the font styling back to the defaults used by your template, click the Tx button.

Remove Text Formatting

To change the color of the text, click the A button.

 

Change Background Image to a Background Color

The templates designed by Albemarle PR already have several images. This increases loading time for the site. If you choose to use sections, it is recommended that you delete the background image and use a background color.

 

Step 1: Click on the Section and then Edit Background.

Step 2: On the window that appears, click the down arrow.

 

Change Weebly Section Image

 

Step 3: Click Color and then Change Color.

 

Change Weebly Section Color

 

You can use the color slider or add the code for the color of your choice. For a white background color, use HEX code #FFFFFF.

 

Background Color Code

See also:

+ How to Move or Copy Sections on Weebly
+ How to Create a Layout Library on Weebly