Styleguide
Bear Bones Web utilizes a custom WordPress theme called Boilerstrap, built by the founder, Alexis.
Boilerstrap uses Bootstrap to build responsive layouts and components, along with Advanced Custom Fields.
The Layouts
The following sections outline the modules found within the Boilerstrap theme. For more information, please feel free to drop us a line.
Cards
The Cards element utilizes a set of options that allows the user to display either a set of solid background with simple text cards, or a full-image card with title and description.
Two Columns, Full Format Card with Image and Text:
Card Example:
Optional Subheader
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Card Example:
Optional Subheader
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Carousel
A carousel is a group of photos or slides used to display information in an interesting, interactive way. While they’re not the best for SEO, when used sparingly, a carousel can enhance many layouts.
The Carousel layout found in the Boilerstrap theme comes equipped with options such as captions, arrows, and indicators.
The Hero Block
The Hero Block allows you to control how the title of the page looks and whether it should have a subtitle. This element can only be used once, and is recommended to keep it at the top of the page. The title is controlled through WordPress’s native Title function. It can also accept a background image and contains controls for text alignment.
See the top of this page for an example of the Hero Block.
oEmbed (Video Embed)
The oEmbed block features a simple embed area where you can place the link to your video, and Advanced Custom Fields will output an iframe for you.
Gallery
Every artist needs somewhere to showcase their work. This simple grid layout re-flows to two-column and one-column in smaller screens, and features hover effects that are visible in mobile and touch devices.
Check out the Artist’s Demo page to see this element in action!
(Stock photos used on this page are courtesy of Pexels. Click on each individual tile above to check out the photographers’ works.)