-2

I am new to Drupal 8 and want to link a custom CSS file in my bootstrap subtheme. There is no way to link the CSS file in the theme.info.yml file. however, I was able to link my custom CSS in theme.info in Drupal 7. Guide me on how to add custom CSS in the Drupal 8 bootstrap subtheme.

3
  • 1
    Why would you want to add the custom css in bootstrap main theme ? Sep 27, 2017 at 5:52
  • To implement my own design. Sep 27, 2017 at 6:58
  • @ShakilAhmad You can definitely implement your own design in a sub theme; sub themes can override every aspect of the main theme. A subtheme is a way of protecting your changes when the main theme is updated; it doesn't limit your design in any way. Sep 27, 2017 at 9:20

3 Answers 3

3

Bootstrap is designed for you to add extra CSS to a subtheme, not the main theme.

The Bootstrap documentation says this:

Warning You should never modify any theme or sub-theme that is packaged and released from Drupal.org, such as Drupal Bootstrap. If you do, all changes you have made will be lost once that theme is updated. Instead, you should create a subtheme from one of the provided starterkits (this is considered a best practice). Once you've done that, you can override CSS, templates, and theme processing.

Bootstrap even provides starter kits so you can easily make the theme yourself, plus step-by-step documentation.

1

Though it's not a good idea to add your own CSS to a base-theme, you need to add it to bootstrap.libraries.yml

1

Don't do on main theme instead create a sub-theme and change what you like. Here are some links that can help you set up Bootstrap sub-theme

You can use either SASS or LESS starterkit. Hope this helps you.

3
  • Yes, I know that editing main theme is not good practice. but I just want to know how. Sep 27, 2017 at 7:00
  • Please follow instruction mention here - webfoobar.com/node/9
    – Bhagi
    Sep 27, 2017 at 9:30
  • I always convert scss to css extension using gulp and the converted file save inside the css folder (themes\custome_theme\css\style.css). So, I can put reference on custom_theme.libraries.yml point to the style.css file. All my custom scss files keep under the "scss" folders. My folder structure of custom .scss files themes\custom_theme\scss\custome_theme\*.scss (files).
    – Bhagi
    Sep 27, 2017 at 9:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.