The Diamond WordPress theme comes with 2 main layouts for your site, Full-Width or Boxed. These settings can not only be changed globally but also on a per-page basis if needed or via a theme filter. Below you can learn about the different layouts and how to change them on your site.
Below is a quick explanation of each layout type included with Diamond to give you a better idea of how they look.
The full-width layout is the default layout for the theme and it displays your content centered of course but with a white background through-out. This layout doesn’t have any padding around the main wrapper.
The boxed layout has a padding around the main wrapper as well as a background applied to it so that you can apply a custom background to your body and all your content will be centered with the background flowing around it.
Choosing Your Layout
Choosing your preferred layout is extremely simple and below I will show you 2 ways in which you can do it!
1. Global Setting
The global setting located in the Customizer at Appearance / Customize / Layout will allow you to easily configure the theme layout globally for all pages, posts, archives…etc.
2. Per-Page Setting
If you must alter the main layout for a specific page or post you can do that via the Meta box located in the post editor screen. Have a look below:
Diamond includes 4 different layouts for your pages/posts – right sidebar, left sidebar, no sidebar and full-screen. Below is an explanation of each layout style as well as how to alter your layouts globally, per page or via the theme filter.
Content Layout Types
- Right Sidebar
- Left Sidebar
- No Sidebar
- Full-Screen (used to create full-screen background areas)
Pages – Setting
To alter the default page layout go to Appearance > Customize > General > Pages
Page with Sidebar
Page No Sidebar
Changing Layout Per-Page
If you want to alter the layout of any page or post you can also do so. This is actually something you will likely do a lot for creating pages like your homepage, about, contact, services…etc.
Diamond includes a powerful function so you can easily tweak the widths of your site (main/content/sidebar) for all responsive sizes. All you need to do is go to Appearance -> Customize -> Layout to tweak your layouts and view the changes live.
- Container Width: Your site width (all content).
- Content Width: The area with the content when your left or right sidebar is enabled.
- Sidebar Width: Your sidebar width.
This is the width of your site. You can use pixels or percentages for the value. There isn’t any max or minimum.
The “content” area just like the name suggests is the area where you content is.
And the “sidebar” is your main sidebar.