Skip to content

Theme Installations

Barrio & Bootstrap 4/5 - Barrio SASS Starter Kit

Barrio - drupal.org

Bootstrap 4/5 - Barrio SASS Starter Kit - drupal.org

Require 'Barrio' & 'Bootstrap 4/5 - Barrio SASS Starter Kit'

lando composer require 'drupal/bootstrap_barrio:^5.5' 'drupal/bootstrap_sass:^5.0'
git add composer.json composer.lock
git commit -m "Download drupal/bootstrap_barrio and drupal/bootstrap_sass"

Create a Custom Subtheme

Use Bootstrap 4/5 - Barrio SASS Starter Kit Installation Guide and create a custom subtheme.

IMPORTANT! We have modified gulp tasks to obtain a robust compile experience.

Then, ensure that everybody uses the same node and npm versions in the dev team. (Use sudo n).

In order to run SASS using node 16+, apply the patch in this issue Errors on running npm install in subtheme on Node 16+.

node 16.16.0
npm 8.11.0
# Run these from the project's repo root
sudo n 16.16.0
cd ./web/themes/custom/customtheme
test -f package-lock.json && npm ci || npm install

# Compile js and css and start browsersync
npm run dev

# Compile js and css
npm run build

Update project's README.md for developers to compile the theme.

Enable and Configure Custom Theme Created

Enable the theme from Drupal UI Appearance (/admin/appearance).

lando drush cex --yes
git add .
git commit -m "Enable new custom theme"