This month we are introducing the new 2019 CAES-Extension theme for WordPress sites. The 2019 theme is an upgrade of the 2016 theme with design tweaks and improvements.
For our example screenshots, we’ll use a demo version of the UGArden website, that uses the 2019 CAES-Extension theme.
The 2019 CAES-Extension theme has many of the same, basic customization features that the 2016 version did, with a few additions noted below.
- Logo – Title: If the logo has been selected under Customize > Site Identity, you can optionally have the logo be placed to the left or the right of the site title under Customize > Layout.
- Display Posts Page’s Sidebar: If “Hide” is selected, this option removes the sidebar from your Posts page, or a page that lists your latest posts.
- Display Single Post’s Sidebar: If “Hide” is selected, this option removes the sidebar from all of your individual post pages.
Font options (under Customize > Fonts) have been simplified down to three settings:
- Header and Titles Font Family: Make the title and heading fonts either Montserrat (default), Verdana, or Georgia.
- Header Font Size: Make the site’s top header (site title) font size Medium (default), Small, or Large.
- Content: Select the font family for body content and widget text. Choices are Verdana (default) or Georgia.
Color options (under Customize > Colors) now include the following:
- Top and Bottom Bars: Black or white for the pre-header and copyright bars.
- Link: Red or blue for content links.
- Header Background: Custom header background color.
- Header Text: White or black.
- Main menu first level: color or white background: Custom color or white for main menu.
- Main menu and “read more”: Custom color for main menu background (if selected above) and color of read more buttons.
- Main menu – current section: Highlight color for current page in main menu.
- Article title: Article title color.
- Footer: Light gray, gray, dark gray, or darker gray for footer background color.
Block editor features
The 2019 theme supports WordPress’s block editor. The block editor give you flexibility and more mobile friendly of layout options for your page and post layouts.
Full width Image and Cover Blocks
Our demo site’s homepage is set up to use a no sidebar template. This gives us room to use full width blocks that reach from edge-to-edge of the page.
You can set up an image block to be full width. This works well with graphics designed as banners on the top of a homepage.
If you don’t have a banner graphic, you can instead use a full width cover block. The cover block uses text that’s overlaid on top of an image you select from your gallery.
Just make sure that your cover block text is accessible and easy to read with your image choice! Use the opacity option in the cover block’s settings to darken the background if necessary for readability.
Hide the Title
On pages you can hide the title in the document settings to the right. Use this when you would like to use a full width image or cover block at the top of the page without a page title before it. You will still need to fill out the page title in the editor for search engine purposes.
A column block allows additional blocks to be laid out side-by-side, on both pages with and without sidebars.
The theme allows template elements (such as page content, the header, and footer) to extend from edge-to-edge of the screen. This can be done with certain shortcodes inserted on a page/post. Note that these can only be used on pages/posts that do not use a sidebar.
The search is now always located in the top right hand corner in the pre-header, by clicking the Search button. You can still opt to use a search widget in the sidebar, but having it in the pre-header ensures a search is available on every page.
An administrator log in is now included more subtlety on every page, in the bottom left corner, next to the copyright info. Taking up space with a login widget in the footer or sidebar sections isn’t necessary.
A couple of demo sites that feature the new theme can be viewed here:
This theme works well with shortcodes that build out cover images (banners) and columns. Learn more about how those work here: