Problem adding FancyBox js

I’m using the latest version of Roots and trying to add FancyBox. This worked fine on my last Roots site, but it was using the previous Grunt file.

I placed the FancyBox folder into the js/plugins dir, added the function to _main.js and then added the line ‘assets/js/plugins/fancybox/js/*.js’, to the jsFileList in grunt.js.

When I load the page I get an invalid token error.

I’m at a loss, any help would be greatly appreciated?

Since you added Fancybox to assets/js/plugins instead of loading it with Bower, you do not add it to jsFileList. jsFileList already has 'assets/js/plugins/*.js'

You should be installing Fancybox with Bower, and then adding the path to the unminified JS in the assets/vendor/fancybox/ directory to jsFileList


Ah, ok. Thanks Ben!
Had a tight deadline and didn’t get a chance to familiarize myself with Bower.

It’s working now, thanks again!

Well, I loaded fancyBox using bower and I added 'assets/vendor/fancybox/source/jquery.fancybox.js' to jsFileList. Cool! But what about CSS (jquery.fancybox.css file) and images?

@popsy: This is going to be solved in the upcoming release of Roots… until then…

Check out these instructions I gave on loading bxSlider: How to adding a Responsive jQuery Slider to Roots

Mh, thanks. What will do the upcoming release? And when it’ll be released?

You ran read more about it here:, as of now there is no exact ETA for the release.