Radix, Drupal component-based bootstrap theme

Radix is the original component-based theme for Drupal. It comes with Bootstrap 5, Sass, ES6, BrowserSync, BiomeJS built-in.

Radix Documentation

Read the comprehensive documentation on Radix 6.x and learn about its ideology and structure

 

📚 Radix Documentation

Which version? For Bootstrap 5, you can go cutting-edge and start with 6.x or start stable and go with 5.x (don't!), for Bootstrap 4, download 8.x-4.x. For Bootstrap 3. download 8.x-3.x.


Quick start for Radix 6 (Drupal 10.1+)

Note that 6.x works with Starterkit theme and Single directory components in the core, so no need to use the components module anymore:

Drupal Radix CLI

Try our new Radix CLI with features like list, add and generate new components


drupal-radix-cli

 

Getting started with Radix CLI

  1. Enable the Single directory components and Serialization:
    drush en sdc serialization -y
  2. Download and enable the Radix theme:
    composer require 'drupal/radix:6.0.x-dev@dev'
  3. Create a sub-theme using Drush (Considering you are using drupal/recommended-project):
    drush --include="web/themes/contrib/radix" radix:create SUBTHEME_NAME
  4. Set default theme:
    drush then SUBTHEME_NAME -y; drush config-set system.theme default SUBTHEME_NAME -y
  5. Go to the newly created theme directory:
    cd /path/to/SUBTHEME_NAME
  6. and then switch to the appropriate node version using nvm:
    nvm use
  7. Install the required packages:
    npm install
  8. In the root of the theme, create a copy of the .env.example and rename it to .env.local:
    cp .env.example .env.local
  9. Update the DRUPAL_BASE_URL variable in your .env.local to point to your localhost address (this file is .gitignored by default to avoid conflicts)
  10. Watch:
    npm run watch
  11. Build for production:
    npm run production

Documentation on how to use the theme is coming soon or go ahead and discover!


Quick start for Radix 5 (Drupal 8 & 9)

Watch A quick walkthrough of Radix:5.x, the theme structure and how to get started video you can see below:

💡▶ Watch Radix 5.x Getting Started Video

 

Also, you may watch:

 

On an already-running Drupal installation:

  1. Download and enable the components module, if you are on Drupal 10 make sure to use composer require ^3.0 version:
    composer require drupal/components
    drush en components -y
  2. Download and enable the Radix theme:
    composer require drupal/radix; drush then radix
  3. Create a sub-theme using Drush (Considering you are using drupal/recommended-project):
    drush --include="web/themes/contrib/radix" radix:create SUBTHEME_NAME
  4. Set default theme:
    drush then SUBTHEME_NAME -y; drush config-set system.theme default SUBTHEME_NAME -y
  5. Install dependencies:
    cd /path/to/SUBTHEME_NAME
    and then switch to the appropriate node version using nvm:
    nvm use
    followed by:
    npm install
  6. Copy the proxy.example.js to proxy.js in the config directory of your subtheme:
    cp config/proxy.example.js config/proxy.js
  7. Update proxy variable to your localhost address in config/proxy.js(this file is .gitignored by default to avoid overrides)
  8. Watch:
    npm run watch

Support and Credits

 

Join the Radix Slack channel

Join Drupal Radix Slack channel.

Or search for #radix on Drupal Slack.

 

Ramsalt Norwegian Drupal Agency

Supporting organizations: 
5.x/6.x Development/Support/Maintenance
7.x, 8.x Initial Development/Support
8.x Maintenance and 5.x Initial Development

Project information

Releases