Bravado Setup Guide
This is the setup guide for the Bravado WordPress theme.
A 360x360 image is expected for the homepage template. This will scale down to be your logo on all other non-homepage pages in the header.
Note that the circular nature of the logo is part of the image. Bravado does not use CSS to "force" a circular logo, as this can cause unexpected results depending on how your image is sized. And the fact that your branding may not allow for a circular logo.
If you do want, we encourage you to edit the image in the photo editing software of your choice.
Short, separated words will break normally. As always, refer to the demo for a good use of the menu.
Upload a logo via Customizer
Since Bravado is the known as known as a "personal branding" theme, you probably want to upload a "profile" picture. You can do that through the handy Customizer control.
A 360x360 image is expected for the homepage template. This will scale down to be your logo on all other non-homepage pages in the header.
Note that the circular nature of the logo is part of the image. Bravado does not use CSS to "force" a circular logo, as this can cause unexpected results depending on how your image is sized. And the fact that your branding may not allow for a circular logo.
If you do want, we encourage you to edit the image in the photo editing software of your choice.
Adjust Reading Settings for an even Article Grid
Bravado utilizes an "article grid" design on your main blog index page, archive pages, and search result pages. At its widest, the article grid spans four posts. Then it breaks down to rows of two posts on narrower widths, and eventually rows of one post. Regardless, it makes sense to have a multiple of four set in your reading settings. We use eight on our demo, but you could also use 12, get really square with 16, 20, 24, and so on. That way on the first page load, you can make sure there are no "stragglers" on the bottom rows.
Featured Images
Bravado uses WordPress' native post thumbnails feature for content in two locations:- The previously mentioned article grid, visible on index pages, archive pages, and search results pages.
- As a pseudo header image, visible on single posts, pages, and any custom post type you register with featured image support.
Install Jetpack for Infinite Scroll
Wherever there's an article grid, there's also support for infinite scrolling via a "More Posts" button whenever the Jetpack Infinite Scroll module is active. This enhancement will give your WordPress site a bit more of a smoother pagination over the usual "Previous Posts" and "Next Posts" links. All you have to do is install the plugin, and enable the infinite scroll module. Bravado takes care of the rest. If your sole purpose for using Jetpack is to utilize Infinite Scroll, you can do so without connecting to WordPress.com with Jetpack's Development Mode. This is because Infinite Scroll is one of the Jetpack modules that does not require WordPress.com's infrastructure to operate. To activate Jetpack Development Mode, simply add the following line of code to your wp-config file, as described in this blog post on the Jetpack website.define( 'JETPACK_DEV_DEBUG', true); Primary Menu and Widgets
Bravado's primary menu and all widgets are tucked away in a little hamburger menu popout. To use the menu, simply create a menu as you normally would. The hamburger popout menu looks best no more than two levels deep, but will still look fine with deeper-leveled menus. After creating the menu, make sure you select the "Primary Menu" location to make sure it's displayed in the right place. Widgets will display below the primary menu. Bravado has styles for all the default widgets, including lists, calendar, and tag clouds, as seen on our demo.Homepage Template Setup
Bravado includes an optional homepage template. We don't "force" you to use it by including a front-page.php or home.php page file in the theme. Rather, it's set up as a custom page template. The homepage template has three components.- A homepage menu (we'll get into more detail on that later)
- Four latest blog posts in the article grid template. No additional configuration is needed on your part, this is automatic.
- A short blurb for content. And possibly an email opt-in form.
[jetpack_subscription_form title="" subscribe_text=""]
Unlike Infinite Scroll, Jetpack Subscriptions does require a WordPress.com connection to function.
We're working on support for more email opt-in form plugins that can be embedded via shortcode, similar to Jetpack Subscriptions, as well.
Homepage Menu
Due to the rather large fonts we use in Bravado, we don't recommend super long words to be used here. It won't break the layout, but the width of a long word extends past the container, it will appear to be cut off. Similar to selecting the "Primary Menu" location for the popout menu, you'll need to select the "Homepage Menu" location for the homepage menu. The menu name does not matter, it's just for your internal use.
Short, separated words will break normally. As always, refer to the demo for a good use of the menu.
Adjust Reading Settings to set the homepage as your homepage
After setting up your your homepage template, you'll probably want to actually set it as your homepage. But first, we'll want to create a page for our blog, unless you don't want your WordPress site to be really blog-focused for some reason. After your "Home" and "Blog" pages are set up, go to the "Reading Settings" page, the same one we used to adjust how many posts were displayed per page, and change your front page display settings.