# Flexslider bower font quandry

**URL:** https://discourse.roots.io/t/flexslider-bower-font-quandry/4195
**Category:** sage
**Created:** 2015-07-06T14:46:17Z
**Posts:** 3

## Post 1 by @Alex_Hunter — 2015-07-06T14:46:17Z

`$ bower install --save flexslider`  
`$ gulp`  
FlexSlider `bower.json` doesn’t include fonts, so I add an override to Sage `bower.json`  
Problem is that Flexslider’s fonts dir is one level below the main css file and that is defined in a LESS stylesheet. So the CSS file doesn’t correctly reference the fonts as …/fonts/ where the fonts are placed by Bower.

What’s the best way to fix this incorrect variable (from Sage’s perspective)? Is there a simple way to override a single LESS variable value and have bower or grunt compile that one change? Otherwise, I’m guess I have to manually synchronize FlexSlider directly into the Sage project.

Thoughts?

---

## Post 2 by @kalenjohnson — 2015-07-06T16:38:05Z

You can override LESS variables if they are in a separate file, and then overwrite those variables before importing the actual LESS stylesheet which uses the variables.

Other than that, since CSS and even pre-processors are still relatively primitive, you can just override the `@font-face src` style with the correct URL’s, anywhere in your project. That will keep you from having to copy-paste the entire stylesheet to your project.

---

## Post 3 by @peterjrees — 2016-04-01T02:03:38Z

I considered overriding the `@font-face src` style in **\_global.scss** but having incorrect font paths remaining in the Flexslider stylesheet was bugging me.

I ended up removing the original Flexslider stylesheet in **bower.json** :

`"flexslider": { "main": ["jquery.flexslider.js", "./fonts/*"] }`

I then copy-pasted the Flexlider stylesheet to its own Sass file (with font paths corrected) **\_flexslider.scss** and injected that into the main stylesheet via **main.scss** :

`@import "components/flexslider";`

Just need to make sure it gets imported before **\_global.scss** if you want to override any of the default styles in there.