0

How do I load the Bootstrap theme (css, js, fonts) locally?

I've searched around the drupal stack exchange, but every suggestion I've come across doesn't solve the problem. It seems like the other option is to create a sub-theme, but I'm not even sure if that will load all the necessary files for bootstrap locally/offline. The whole purpose of this is to load the bootstrap theme and its css/js/fonts without using any internet.

The issue is that I'm seeing the error as another user did like this: https://www.drupal.org/files/issues/screenshot_218.jpg

There are answers like these below, but there has to be a way to do it without more installation other than drupal modules: https://www.drupal.org/node/1978010 Using own Bootstrap 3 files

1

You can download bootstrap package and include it in your theme folder.

and go to admin/appearance/settings/bootstrap then go to 'Advanced' and change CDN provider to custom. give your local bootstrap css,js urls.

if you need to import it to a custom theme you can add it the bootstrap package like below.

your_theme.info

stylesheets[all][] = css/bootstrap.css
scripts[] = js/bootstrap.min.js

define the regions you need in your custom theme info file.

remmber to use the 'https://www.drupal.org/project/jquery_update' module for JS.

  • Thanks for the help. I tried your method and it worked. As a side note, for anyone that doesn't know the local bootstrap URLs (like me), the URL is: [yoursitename.com/sites/all/libraries/bootstrap/] – Mike Jul 26 '17 at 18:30
  • Great! glad it helped :) – danuddara Jul 26 '17 at 23:09
  • "You can download bootstrap package and include it in your theme folder." --- Package has a zillion files...what folder exactly to paste? – Bruno Vincent Oct 22 '18 at 2:36
1

It's very simple . Please follow these step to create a sub theme using bootstrap.

  1. Install drupal bootstrap theme.
  2. copy less folder from starterkits.
  3. Download bootstrap css and js file in your sub theme folder.
  4. configure you theme info file.

     stylesheets[all][] = css/bootstrap.css
     scripts[] = js/bootstrap.min.js
    
  5. Enable your sub theme.

If you have any problem I create a video tutorial for you please click on this link tutorial

Thank you

  • Thanks for your answer. I tried the solution by danuddara, but I'm going to try your solution in another instance of drupal. – Mike Jul 26 '17 at 20:37
1

Just for future - if you have no option to compile less files (as me) you can:

0) Install bootstrap base theme

1) Copy less folder from starterkits to /themes folder and rename it as you want

2) Download bootstrap css and js file in your sub theme folder into /bootstrap

3) NEW: copy css file from base theme (from folder /css/YOUR_BT_VERSION ) - this is the compiled css - it is nesesary for many drupal features. I add this file in /css folder and rename it to overrides.css

4) Configure you theme info file as usual (change name as folder name), add description...

5) Add stylesheets[all][] = bootstrap/bootstrap.css line and one more line for file from step 4 in your theme.info file - stylesheets[all][] = css/overrides.css

0

I wrote a short article on how to do this clearly...for 2018 also:

http://brunovincent.net/data/how-to-install-use-drupal-7-bootstrap-theme-locally-without-cdn/

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.