System updates

We’re experiencing issues that may affect your Square services. We’ll continue to update our status page with more information.

Home>Building Your Website

Adding Sections to Your Pages

The Section element gives you the ability to create engaging pages that will delight your visitors. You can drag other elements into sections, customise the background and change the height and position on the page.

drag-section-new

Drag the Section element from the Build tab onto your page. The section will fill the full width of the page where you place it, so choose a spot above or below other elements on the page. If you’re using a Splash page type, you won’t be able to add a section as this style of page is designed to display a limited amount of content with a single background image.

choose-section-layout

Next, you’ll want to add content to your section. We’ve put together some pre-made, customisable layouts to help you quickly start building great-looking sections.

select-layout

Click on any one of the layout styles to see a preview of how it will appear on your page. If you like what you see, go ahead and save. You can then rearrange, add or remove any of the elements in the layout and customise them with your own content.

Don’t see anything you like in the section layouts? No problem – you can add elements manually, too! Just click outside of the layout panel to cancel and start dragging in the elements you want.

edit-background

Each section on a page can have its own unique background colour or image, and if you’re a Pro subscriber you can even add a video background. Click on the section and then on Edit Background.

color-picker

For image and video backgrounds, you can upload your own or choose one from our built-in galleries. Background colours can be selected using the Hue slider or by entering the specific hex code for the colour you want.

resize-section

Want to make a section taller or shorter? Click on it and drag the blue bar at the bottom up or down to adjust the height, which will be displayed in pixels as you move the bar. If the tool tip says “Auto”, that means the section can’t be made any shorter, so you’ll need to remove some elements first.

edit-advanced

You can also change the vertical alignment of all elements in a section by clicking on Edit Background, and then Advanced. Elements can be aligned to the top, middle or bottom of a section.

move-copy-section

Need to move or copy a section to another page? Click on the section and then on Move. You can move a section up or down in position on the same page, move it from one page to another, or copy it to a different page or to the same page.

Can't find what you need?