Global Section Settings
Learn to configure global section settings in Breakdance, ensuring consistent layouts, spacing, and professional design for your author website.
Introduction
Throughout this course I’ll emphasise the importance of consistency in the layout, colour and design of an author website. Applying consistent fonts, colours and spacing in an author website is a subtle but powerful visual cue to a visitor they are getting a professional experience.
Building this experience starts with configuring the global settings for our sections. As you saw in previous lessons after we added a section to the Style Guide page we were able to place other elements inside it including headings, text, links, buttons and more. We are going to configure the global settings for our Sections so they are consistent through out this author website.
Configure Section Global Settings
Staying inside the Style Guide page from the last lesson.
- From the Top Bar of the Breakdance Editor
- Click the dot dot dot menu
- Select Global Settings > Containers
- Click on the edit icon beside SECTIONS
By default Breakdance sets the container width, the width of your website, to 1120 pixels. I recommend keeping this default section width for websites.
The system default for VERTICAL PADDING is 100 pixels. Lets make that a little bigger as I like breathing space between sections.
- Set the VERTICAL PADDING to 18 rem (180 pixels in old money)
- Click Save.
You’ll see in the Live Preview we will immediately get more space to the top and bottom of the section. This padding will be automatically added to the top and bottom of every section we add. This can be changed for individual sections if required.
The default Horizontal padding is 20 pixels for the left and right of the section. I’m going to update this to 2 rem.
Now every time we add a new section it will be 1120 pixels wide, with 18 rem top and bottom padding with 2 rem (20 pixels) of padding on the sides.
This is a well proportioned default section that gives the content it contains plenty of space.
Summary
This lesson covered configuring global section settings in Breakdance to create a consistent and professional layout for your author website. By adjusting default widths, vertical and horizontal padding, you’ll ensure that every section offers a balanced and engaging visual experience, setting the foundation for a polished and cohesive website design.
