How do I install Bootstrap with Bower?

Hi there. I’m just coming aboard with the new Roots. I just did a clean install and cannot figure out how to load Bootstrap. Thanks in advance for your help.

Bootstrap is already loaded:

What do you mean by ‘load Bootstrap’? When npm install is ran, bower install automatically is afterwards (although it’s kinda buggy). bower install installs all of the dependencies in bower.json (including Bootstrap) to assets/vendor/

After I installed Roots, none of the Bootstrap styles showed up so I assumed that I was missing something and needed to ‘load Bootstrap’. I went ahead and ran npm install on the theme directory and saw this:
> roots@7.0.0 postinstall /Users/shaimoom/Sites/roots-demo/wp-content/themes/roots' '> bower install
I went back and checked my clean install but do not see the Bootstrap styles. What am I doing wrong?

What is in your assets/vendor/ directory? Nothing? If so, what happens when you do bower install?

edit: Just realized you might not have built the assets yet… from the README:

  • grunt dev — Compile LESS to CSS, concatenate and validate JS
  • grunt watch — Compile assets when file changes are made
  • grunt build — Create minified assets that are used on non-development environments

Here is what I see in the directory:





I am not sure if there is a correlation but I added a line of code to _general.less and voila! Bootstrap styles appeared. I will do another run of installing so I have this process down for my talk at WordCamp :wink: Thanks Ben.

@benword I have managed to figure out how to work with Bootstrap on my local dev. However, I pushed all the files to my staging site on Media Temple but the Bootstrap styles aren’t showing. Did I mess a step?

Are you deploying with Git? The built assets are .gitignore'd by default. Are you seeing 404s in dev tools?

I am using the Github Mac App and DeplyHQ to deploy. I will go ahead and remove the built assets from .gitignore. Thanks I will give this a shot.