In this article:
BoldGrid Crio allows you fine tune control over your Blog Page design from the Customizer. The following guide will teach you what each control means, and how to use them.
What is the Blog Page?
The Blog Page is the page you have selected from Appearance → Customize → Design → Homepage, and shows your recent posts.
- In the Dashboard, navigate to Appearance → Customize
- In the Customizer menu, navigate to Design → Blog → Blog Page → Post List Settings
Here you will see all the elements you can control. While it may look overwhelming, keep in mind it is not necessary to use each panel.
While working in this panel, if you want to use a color you do not see, you will need to change a color in the color palette.
All changes are shown in the Live Preview, so it’s easy to try multiple layouts. Once you are happy with the design, click the blue Publish button to make your changes public.
Post List Settings
This panel includes controls for some global elements of your Blog Pate design.
- Blog Page → Post List Settings
Here you can change the number of Columns and number of Blog Posts that appear before pagination. Each post can show the Excerpt, set to an exact length, or the Full Content of each post.
Finally you can decide whether the Blog Page should be contained or full width across the screen. Keep in mind widescreen monitors are growing in popularity so be sure to test your design on multiple screen sizes.
The Blog Page can have a Sidebar on the left or right, or not use one. If a Sidebar is set to show here and on Blog Posts, it will be the same Sidebar with the same content, but can show on different sides if desired.
- Blog Page → Sidebar
Each post shown on the Blog Page uses 2 Background Colors – one for the Header and one for the Content.
- Blog Page → Background Colors
The Post Header includes the Post Title and Meta, which is the Date and Author information. In the image below, the Post Header background is Black.
The Post Content includes either the Excerpt or Full Post Content depending on setting at Blog Page → Post List Settings, as well as Read More link, Categories, Tags, and Comments if displayed. In this example the Post Content background is gray.
If you would like to hide each Post Title you can do so from here. You can also select the Color, Font Size, and Position.
- Blog Page → Titles
Even though the Font Sizes shown are Heading sizes, they are paragraphs so the selection will not affect your SEO. The H1 for the Blog Page is the Page Title entered in the WordPress dashboard.
There are multiple options for how the Featured Image can display, or set to hidden if desired. Each option is shown here for easy comparison.
- Blog Page → Featured Images
This is the default selection. The Featured Image is shown above the Post Header, which includes the Post Title and Meta. You can set a width and height to easily customize this starting design.
Moving the Featured Image above the Post Header will give separation between the text. Once again you can adjust the width and height if desired.
When the Featured Image shows in the Header Background, an overlay is added to increase contrast for the Post Header text. The color of the overlay can be changed at Blog Page → Background Colors → Post Header.
In Post Content
If you want the background color of the Post Content, which includes the Read More button, Post Excerpt or Summary, Categories, Tags, and Comments, to show around the image, select In Post Content.
Links & Advanced
Since there are so many options available within the Link panel, we have a separate article on customizing your Blog Page Links.
Take your design to the next level by using the Advanced options. Learn how to use the Blog Page Advanced options for a truly unique Blog Page design.
Have any questions about Blog Page customization? Let us know below!
200+ Design Templates + 1 Kick-ass SuperTheme
6 WordPress Plugins + 2 Essential Services
Everything you need to build and manage WordPress websites in one Central place.