Bricks — is a new way of building pages on top of Entity Reference, Display Modes, Layout API, tabledrag.js and Flat Tables. Everything is in Drupal core that makes Bricks ultra-lightweight and developer-friendly.
In terms of concept Bricks is a new generation of Paragraphs, an alternative to Panelizer and a good friend to ECK, Inline Entity Form and your favorite WYSIWYG. Shortly, it allows you to nest Entity Reference field items using Drupal drag & drop UI (exactly like for menu or taxonomy items).
- NEW As of 8.x-1.6 Bricks supports Layout API!
- ↳ It’s recommended to migrate from Bricks Bootstrap to Bootstrap Kit (but not required).
- Open pre-configured sandbox.
- Click Launch sandbox and wait.
- Follow the installation (all settings should be pre-filled, don’t change them).
- Go to Extend and enable Bootstrap Kit Demo.
- Go to Appearance and set Tweme as default theme.
- Find an auto-created node and go to Edit mode to check magic out!
- Finally go to Content and create your own first Bricky page!
- Like it? => Support by ★ starring on Drupal.org, ★ starring on GitHub and/or sharing on Twitter.
- Follow the instructions above, but using the different sandbox link.
- Then follow the Paragraphs setup instructions.
Default setup (Bricks/ECK/IEF):
- Install Bricks Default (shipped with Bricks) and its dependencies.
- Done! Now you can create Bricky pages (content type) using simple pre-configured ECK bricks like Text, Image, Wrapper and special Layout brick (which can render other bricks via Layout API). Use an auto-created node as a live playground.
Theming with Bootstrap 3/4:
- Additionally install Bootstrap Kit and its dependencies.
- Done! Now you can use Columns, Accordion, Carousel and Tabs components via Layout brick. Install Bootstrap Kit Demo (shipped with Bootstrap Kit) to get a sample node.
Using with Paragraphs:
- Additionally install Paragraphs Demo (shipped with Paragraphs) and its dependencies.
- Also install Bricks Revisions (shipped with Bricks) to be able to reference revisionable entities like Paragraphs.
- Go to Structure > Content types > Paragraphed article > Manage fields.
- Delete default Paragraphs field.
- Create new Paragraphs field of type Bricks (revisioned):
- Name: Paragraphs (field_paragraphs)
- Type of item to reference: Paragraph
- Allowed number of values: Unlimited
- Go to Manage form display and set Bricks tree (Inline entity form) widget for Paragraphs field.
- Go to Structure > Paragraphs types and create Layout type.
- Done! Now you can create Paragraphed pages (content type) using default Paragraphs as bricks: Text, Images, Image + Text, User and special Layout brick (which can render other bricks via Layout API).
All new Bricks for D8 has no requirements and works with ANY entity types!
- Bricks Core gives you a Bricks field/widget/formatter pack allowing you to compose flexible content of bricks (Layouts and Entities) via draggable tree UI.
- Bricks Inline 8.x-1.1+ allows you to create and edit bricks right in the draggable tree via Inline Entity Form.
- Bricks Revisions 8.x-1.3+ integrates Bricks with Entity Reference Revisions.
Upgrading from 8.x-1.5
- Upgrade as usual.
- Create Layout bundle manually to be able to use the newest Layout API integration:
- ECK: Structure > ECK > Bundle list > Add bundle.
- Paragraphs: Structure > Paragraphs > Add type.
- Don’t forget to allow this bundle in your Bricks field settings!
- Project pages: uibricks.com • drupal.org/project/bricks.
- Source code: github.com/highweb/drupal-bricks.
- Working group: groups.drupal.org/bricks.
- Team: timezone.io/team/drupal-bricks.
- Video tutorial: vimeo.com/211714437 by Hans Riemenschneider.
- Tutorial: drupal8.support/en/modules/bricks by Dirk Bernaert.
- June 29, 2017: [Talk] Using of Bricks by Gábor Tompa @ Budapest Meetup
- June 25, 2017: [Sprint] Bricks, Paragraphs, Pattern Lab and Fractal @ Design 4 Drupal Boston 2017
- June 23, 2017: [Session] UI Bricks by Anton Staroverov @ Design 4 Drupal Boston 2017
- June 11, 2017: [Code sprint] Bricks Team @ DrupalCamp Kyiv 2017
- June 10, 2017: [Session] Drupal theming & all the things by Vlad Moyseenko @ DrupalCamp Kyiv 2017
- June 10, 2017: [Session] ref. Bricks as an extension to Paragraphs by Vasily Yaremchuk @ DrupalCamp Kyiv 2017
- May 3, 2017: [Talk] UI Building with Bricks by Anton Staroverov @ New York Meetup
- May 2, 2017: [Talk] Site Building with Drupal 8, Bricks, and ECK by Karl Kedrovsky @ Kansas City Meetup
- March 4, 2017: [Session] Entity Reference as a Component-based Site Builder by Anton Staroverov @ DrupalCamp London 2017
- September 29, 2016: [Session] Drupal 8 Hidden Power by Anton Staroverov @ DrupalCon Dublin 2016
- September 23, 2015: [BoF] Content Management Revolution II by Anton Staroverov @ DrupalCon Barcelona 2015
- November 29, 2014: [Session] Revolutionary new way to create pages in Drupal by Anton Staroverov @ DrupalCamp Moscow 2014
- September 24, 2014: [BoF] Content Management Revolution by Anton Staroverov @ DrupalCon Amsterdam 2014
- hopehouse.net @ Kansas City
- Are brick bundles translatable?
- 100% translatable (thanks Entity Translation and ECK). Just mark them as translatable at /admin/config/regional/content-language.
- Which entity types are supported?
- Bricks can hold references to any entities - ECK or Paragraphs, doesn’t matter. And Bricks Bootstrap is just an example of using ECK.
- Does bricks support revisions of the parent entity?
- Internally Bricks field is a multi-value Entity Reference field => standard revisioning mechanism works. Moreover, Bricks Revisions (core submodule) allows you to revision referenced entities.
- Is there a reason why i can not just use bricks form widget for the normal paragraphs field?
- Paragraphs couldn’t be nested using drag and drop! Bricks field allows you to do (like on gif).
- How to get non-equal column layout, 4-8 in example?
- Use universal Wrapper brick with custom CSS classes on it. Bootstrap example:
Wrapper (.row) |-- Image (.col-sm-4) |-- Text (.col-sm-8)