Installing and Customizing Properly

Hi,
I’m a MAC User using MAMP Pro for my wordpress local site.
I downloaded the most recent version of Roots and installed, customise and activate the Roots theme.
After visiting the page setup, I discovered that the Bootstrap Theme does not seem to have been applied to the page at all.
I see the Menu Items as a list item with bullet points, instead of being a Bootstrap navbar.

The book I am working though indicates that if I encounter this kind of problem, that probably means the permalink needs to be reset.

However, I’ve reset the permalink structure to /%postname%/
multiple times already but the Bootstrap css still does not get applied to the page…

What is going on there and how can I fix this?
Am I missing any dependencies?

I’m just using MAMP…I’m not using Bedrock or Grunt…

The book I’m reading is Bootstrap Site Blueprints and in the Roots theme park it doesn’t seem to indicate that Grunt or Bedrock are prerequisites to using Roots…

Thank you for the help…

Your book is out of date. You are best off following the instructions in our README or downloading an older version of Roots that includes everything pre-compiled, I think the most recent is 6.5.0.

Hi,

Ok…
so from what I gather from the instructions…
Am I correct in understanding that Grunt is REQUIRED to run ROOTS but BEDROCK is optional?

And Bedrock is optional but you just have to set this:
define(‘WP_ENV’, ‘development’);
in wp-config.php

Thank you very much…I’ll try to work through the installation instruction…

That’s all correct. You will also need Bower in addition to Grunt.

1 Like

Thank you very much for your help :slight_smile:

Hi,

Ok…I installed grunt globally on my node…e.g. npm install -g grunt-cli

Then I went to wp-config.php and pasted this:
define(‘WP_ENV’, ‘development’);

then I went to the roots-master folder which is the folder the roots theme is contained.
I then typed this on the console:
npm install

Then I get this error:

    > roots@7.0.1 postinstall /Applications/MAMP/htdocs/wordpress4.0/wp-content/themes/roots-master
> node node_modules/bower/bin/bower install && grunt dev

bower not-cached    git://github.com/jquery/jquery.git#1.11.1
bower resolve       git://github.com/jquery/jquery.git#1.11.1
bower not-cached    git://github.com/scottjehl/Respond.git#1.4.2
bower resolve       git://github.com/scottjehl/Respond.git#1.4.2
bower not-cached    git://github.com/Modernizr/Modernizr.git#2.8.2
bower resolve       git://github.com/Modernizr/Modernizr.git#2.8.2
bower not-cached    git://github.com/twbs/bootstrap.git#3.2.0
bower resolve       git://github.com/twbs/bootstrap.git#3.2.0
bower ECMDERR       Failed to execute "git ls-remote --tags --heads git://github.com/Modernizr/Modernizr.git", exit code of #69

Additional error details:
Agreeing to the Xcode/iOS license requires admin privileges, please re-run as root via sudo.

npm ERR! roots@7.0.1 postinstall: `node node_modules/bower/bin/bower install && grunt dev`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the roots@7.0.1 postinstall script.
npm ERR! This is most likely a problem with the roots package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node node_modules/bower/bin/bower install && grunt dev
npm ERR! You can get their info via:
npm ERR!     npm owner ls roots
npm ERR! There is likely additional logging output above.
npm ERR! System Darwin 13.4.0
npm ERR! command "node" "/usr/local/bin/npm" "install"
npm ERR! cwd /Applications/MAMP/htdocs/wordpress4.0/wp-content/themes/roots-master
npm ERR! node -v v0.10.28
npm ERR! npm -v 1.4.9
npm ERR! code ELIFECYCLE
npm ERR! 
npm ERR! Additional logging details can be found in:
npm ERR!     /Applications/MAMP/htdocs/wordpress4.0/wp-content/themes/roots-master/npm-debug.log
npm ERR! not ok code 0

Then I tried running:
sudo npm install

But I end up getting this:

npm WARN cannot run in wd roots@7.0.1 node node_modules/bower/bin/bower install && grunt dev (wd=/Applications/MAMP/htdocs/wordpress4.0/wp-content/themes/roots-master)

Then I tried running grunt by typing:
grunt dev

However I then get this error:

    Running "jshint:all" (jshint) task
>> 2 files lint free.

Running "less:dev" (less) task
>> FileError: '../vendor/bootstrap/less/variables.less' wasn't found in assets/less/_bootstrap.less on line 8, column 1:
>> 7 // Variables
>> 8 @import "../vendor/bootstrap/less/variables";
>> 9 @import "_variables"; // Bootstrap variable overrides and custom variables
Warning: Error compiling assets/less/main.less Use --force to continue.

Aborted due to warnings.


Execution Time (2014-09-27 04:01:58 UTC)
loading tasks    4ms  ▇▇ 2%
jshint:all     121ms  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 72%
less:dev        42ms  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 25%
Total 168ms

What’s going on?
How do I make it work?

Thank you very much.

Do a grunt build first then you ought to be good to go.

Grunt will only succeed in this version of Roots if Bootstrap is successfully installed by Bower, which appears to fail in your case.

Try deleting the node_modules/ dir and running sudo npm install again. If you continue seeing errors then please perform a search; this is a documented issue.

1 Like

Preston,

Roots 7 has been really tough for me as I also don’t get all of the Grunt stuff. Here’s a link that might help you:

http://discourse.roots.io/t/grunt-fails-on-initial-run-after-npm-install/1910/15

Thank you for the clarifying comments - I didn’t mean to mislead the prior poster - I appreciate the clarification myself.