No products in the cart.
Block patterns
New in v6
Utilize prebuilt Bootstrap block patterns to quickly design and structure your content.
Contents
How it works
Thanks to editor-styles, it is possible to replicate the frontend view in the backend and create patterns using the block’s advanced tab:
For example, change the alert-info class to alert-success to display a green alert. More complex patterns such as grids, cards and heroes are built using nested group-blocks.
Usage
To select a pattern in the post/page edit screen, click the + button on the top left > Patterns > Bootscore, and choose a pattern.
Patterns
Layout
Container
Wrap content in a container on page-blank template.
This is a container
Grid
Grid examples are built with group-blocks rows, and nested columns. Change the col classes in the group block’s Advanced tab, delete the placeholder, and fill it with your content.
3/3/3/3
col-md-6 col-lg-3
col-md-6 col-lg-3
col-md-6 col-lg-3
col-md-6 col-lg-3
6/6
col-lg-6
col-lg-6
4/8
col-lg-4
col-lg-8
8/4
col-lg-8
col-lg-4
Alerts
Alert examples that simply use classes in the block’s Advanced tab. You may want to take a look at our alert-icon classes to modify alerts in more detail.
A simple info alert with a link.
Buttons
Simple button examples, links and classes must be edited in HTML view.
Cards
Basic
Some card examples, built with group blocks, that are good to use in the sidebar widget area in combination with blocks.
Card title
Some quick example text to build on the card title and make up the bulk of the card’s content.
Card header
Card title
Some quick example text to build on the card title and make up the bulk of the card’s content.
Categories
Pricing
Prebuilt grid with cards inspired by Bootstrap’s pricing example.
Free
Pro
Enterprise
Heroes
Enhance your homepage with hero components.
Jumbotron
Basic jumbotron
This is a simple Bootstrap jumbotron, recreated with built-in utility classes.
Hero image left
Hero image right
Sections
Use prebuilt full-width sections with the page-blank template to quickly create landing pages with the components above.
Section with heading
Section with heading
This is a section with heading and subtitle wrapped in a container. Use it on the page-blank template.
Some content inside the container.