Drupal 9 Create Bootstrap 3 Subtheme

Follow below steps to create your own theme from bootsrap theme. Below steps are tested for Drupal 9 and Bootstrap 3.

Step 1: Download Bootstrap theme from or use below command to download

drush dl bootstrap

Step 2: Naviagte to bootstrap/starterkits folder and copy THEMENAME folder and paste it to main theme folder

Step 3: Rename THEMENAME to your theme name. I am renaming it to my_custom_theme

Step 4:  Rename below 3 files. Replace THEMENAME with your theme name and starterkit with info

THEMENAME.libraries.yml -> my_custom_theme.libraries.yml
THEMENAME.starterkit.yml -> my_custom_theme.info.yml
THEMENAME.theme -> my_custom_theme.theme

Step 5: Open config folder and rename THEMENAME.settings.yml file inside install folder

THEMENAME.settings.yml -> my_custom_theme.yml

Step 6: Open config folder and rename THEMENAME.schema.yml file inside schema folder

THEMENAME.settings.yml -> my_custom_theme.yml

Step 7: Open my_custom_theme.info.yml and change value for THEMETITLE and THEMENAME.  

type: theme
base theme: bootstrap
core_version_requirement: ^9 || ^10

name: 'THEMETITLE'
description: 'A Drupal Bootstrap 3 based sub-theme.'
package: 'Bootstrap'

regions:
  navigation: 'Navigation'
  navigation_collapsible: 'Navigation (Collapsible)'
  header: 'Top Bar'
  highlighted: 'Highlighted'
  help: 'Help'
  content: 'Content'
  sidebar_first: 'Primary'
  sidebar_second: 'Secondary'
  footer: 'Footer'
  page_top: 'Page top'
  page_bottom: 'Page bottom'

libraries-extend:
  bootstrap/framework:
    - THEMENAME/framework

Step 8: Click on Appearence and Install Theme

Thu, 02/23/2023 - 22:57
Tarun Goswami is a highly experienced professional, currently serving as Technical Lead at a well-established IT services company. With over 12 years of experience across multiple domains, he demonstrates his expertise and passion for the industry through his engaging and informative blog writing in his spare time.
Tags

Comments