Briar, a free minimalist WordPress theme
It’s really exciting to present to you our very first free minimalist WordPress theme Briar. You can preview the demo version at http://demo.slicejack.com/#briar and the code at https://github.com/themejack/briar.
Features
- Minimalistic and modern design
- Bootstrap framework
- Responsive layout (mobile, tablet & desktop friendly)
- Parallax animations
- Full support for post formats
- Customizable with WordPress Customizer
- Full width heading shortcode
- Inline code documentation
Bootstrap
In order to achieve a responsive layout, we used Boostrap framework. Along with the theme there’s a source folder in which you can find less (LESS) and js (Javascript) source files. If you want to compile the files, you need to install dependencies npm install and after that launch gulp with the gulp command.
Animations
Together with the transitional animations, we’ve created a parallax effect with the featured image and with a full width heading that you can add by using wysiwyg editor. To point out information about the author, categories, tags and number of comments we’ve placed a fixed footer on the bottom that becomes hidden once the user scrolls beneath the post content.
Post formats
This minimalist WordPress theme supports Standard, Aside, Chat, Gallery, Image, Video, Quote, Status and Link post formats.
Multilevel navigation
It features multilevel navigation with bounce and pull animation. Below you can check how 3 level navigation works.
Infinite scroll
If you’re using the Jetpack plugin you can use Infinite scroll with custom designed load more button.
Full width heading
By using [heading][/heading] shortcode inside your posts and pages you can add content with a background image that will have a parallax effect (you can see the example on the demo site and on a gif at Animations section.) Shortcode can contain the ID of attachment through a background attribute (example: [heading background="10"][/heading]) and HTML content that you can add through Visual or Text editor (example: [heading background="10"]<h3>Insert your heading here</h3><p>Insert your content here</p>[/heading]). To make it easy for you to add the ID attachment we’ve added a button in the Visual editor.
Customizer
Just like we normally do with our development we decided to use the Customizer to make it easy to manage the theme appearance. You can read more about the Customizer in our post Customizer API. We’ve added Header, Footer, Colours and Layout sections to Customizer and there are also default sections: Background, Navigation, Widgets and Front.
Header
This is the section where you can change Site Title, Tagline, Logo and choose whether you’d like to show Site Title or Logo in the header of your website.
Footer
In this section you can add, remove and change social icons. We’ve prepared Facebook, Twitter, LinkedIn, Dribble, Flickr, GitHub, Google+, Instagram, Pinterest, StumbleUpon, Skype, Tumblr, Vimeo and Behance social icons.
Colours
We’ve also prepared 6 colour schemes: red, orange, yellow, blue, violet and green. Choose your colour scheme, click on the magic button Apply scheme and let the magic happen. You’ll get a preview of the colour scheme. Along with the colour scheme selection you have 15 colour pickers with which you can change the colour of the certain elements on the page. After the colour picker change, your coloor scheme will switch to custom.
Layouts
In this section you can adjust the global layout and layout for Home, Blog, Single, Archive, Category archive, Search, 404 and Default page. If you choose the none option for each layout then such pages will be shown with the global layout.
Ans that’s it! We hope you’ll enjoy using this minimalist WordPress theme!
