-1

I am new to Drupal 8 and want to add some custom CSS in my bootstrap main theme, not sub-theme. I did not find any theme.info file in bootstrap theme directory to link my custom CSS like Drupal 7. Guide me how to add custom CSS in Drupal 8 bootstrap theme.

  • 1
    Why would you want to add the custom css in bootstrap main theme ? – logeshvaran Sep 27 '17 at 5:52
  • To implement my own design. – Shakil Ahmad Sep 27 '17 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. – Patrick Kenny Sep 27 '17 at 9:20
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

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.

  • Yes, I know that editing main theme is not good practice. but I just want to know how. – Shakil Ahmad Sep 27 '17 at 7:00
  • Please follow instruction mention here - webfoobar.com/node/9 – Bhagi Sep 27 '17 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 '17 at 9:43
0

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

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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