Using Dual Sidebars

By default, the right sidebar is shown on the Blog page. When a post is opened, the sidebar disappears. But there is also a left sidebar that can be added on a page-by-page basis in the editor as seen here:

dual sidebars

As you can see, there are a number of configurations to choose from, and on this page I have chosen to display both sidebars.

Each sidebar can contain its own set of widgets, which may be suitable for one or more pages of your site.

However, using dual sidebars greatly reduces the width of the centre text area. By using the Simple CSS plugin, we can get back more space, but it still makes the page very crowded.

Of course, this is not a problem on mobile devices, because the two sidebars are pushed below the main text.

Sidebars CSS

Here is the CSS code added to this page:

.site-content .content-area {
width: 70%;
padding-left: 10px;
padding-right: 10px;
}
.separate-containers .site-main {
margin-left: 0;
margin-right: 0;
}
h1 {
margin-top: 20px;
}
.widget-area .widget {
padding-left: 10px;
padding-right: 10px;
}
table#wp-calendar.wp-calendar-table {
margin-bottom: 0;
}
table#wp-calendar.wp-calendar-table a {
font-weight: 700;
}

Sidebars Page Full Width

An alternative method, that gives you a much wider centre text area on desktop computers, is to set the “Content Container” to “Full Width”

sidebars full width

An example of how this would look can be found on this page.