drupal / display_builder_bootstrap
Provide a Display Builder Demo website with Bootstrap.
Package info
git.drupalcode.org/project/display_builder_bootstrap.git
Type:drupal-recipe
pkg:composer/drupal/display_builder_bootstrap
Requires
- drupal/core: >=11.3 <11.4
- drupal/display_builder: ^1.0.0-beta5
- drupal/display_builder_base: *
- drupal/ui_suite_bootstrap: >=5.2.2
- drupal/ui_suite_bootstrap_components: >=1.0.1
Requires (Dev)
- drupal/display_builder_dev_tools: *
- drupal/sdc_devel: ^1.0.2
README
This recipe extends the Display Builder Base recipe to provide a ready-to-use Bootstrap experience in Drupal thanks to UI Suite Bootstrap and UI Suite modules.
Introduction
A site-builder-friendly Bootstrap theme. Use Bootstrap parts (components, helpers, utilities, and layouts) directly from the Drupal back office (Layout Builder, Manage Display, Views, Blocks, Flags, and more) in a low-code way.
UI Suite provides a cohesive set of modules to implement full design systems in Drupal.
Display Builder leverages the full UI Suite API in a modern visual builder.
Documentation
Drupal recipe documentation:
- https://www.drupal.org/docs/extending-drupal/drupal-recipes
- https://project.pages.drupalcode.org/distributions_recipes/getting_started.html
Display Builder documentation:
Installation
- Start with Drupal 11.3 (NOT 11.4)
composer create-project drupal/recommended-project:~11.3.13 drupal_bootstrap
cd drupal_bootstrap
Quick Icon libraries Setup
UI Suite Bootstrap support icons, here is a quick setup, for more information see UI Suite Bootstrap documentation.
Install with asset packagist, see Drupal documentation:
composer config repo.asset-packagist composer https://asset-packagist.org
composer config --merge --json extra.installer-types '["npm-asset", "bower-asset"]'
composer config --merge --json extra.installer-paths '{"web/libraries/{$name}":["type:drupal-library", "type:npm-asset", "type:npm-asset"]}'
composer require oomphinc/composer-installers-extender:^2
composer require npm-asset/bootstrap-icons:^1.13.1
Quick Recipe Setup
Temporarily require dev versions of some modules:
composer config minimum-stability dev
Install the recipe:
composer require drupal/display_builder_bootstrap:^1.0.3 drupal/ui_styles:1.x-dev
Install Drush (recommended):
composer require drush/drush
Drupal Installation
Recipe is meant for a new website and can not be applied on an existing profile, only minimal profile is supported.
- Install the Drupal Minimal profile
For example, with DDEV and Drush:
ddev config --project-type=drupal11 --docroot=web
ddev drush si -y minimal
- Apply this recipe
Run this command with DDEV, use ddev exec (Drupal 11.3+, this command changed in 11.4+):
ddev exec -d /var/www/html/web php core/scripts/drupal recipe /var/www/html/recipes/display_builder_bootstrap
If the command succeeds, you should see the following output:
[OK] Display Builder with Bootstrap applied successfully
Important: Clear the Drupal cache after applying the recipe.
ddev drush cache:rebuild
Visit your website, for example with DDEV:
ddev launch
Login as admin to your website:
ddev drush uli