WP | Compass (No Rails) - Glyph Icons broken.

[misterzik]

First of all, thanks for this amazing integration of SaSS and BootStrap everything was pretty straight up and works like a charm. The only part i am stuck, it's the part to make glyph icons/fonts work on my site.

I am running wordpress, and in my functions, I've included the following files: wp_register_script( 'in-bs-js', get_template_directory_uri() . '/javascripts/bootstrap.js', array('jquery'), '3.3.1', true ); wp_register_style( 'in-sass', get_template_directory_uri() . '/stylesheets/styles.css', array(), true );

wp_enqueue_script('in-bs-js'); wp_enqueue_style('in-sass'); wp_enqueue_style( in-style', get_stylesheet_uri());

Things ive tried,

hidden comment from _bootstrap-variables.scss, got rid of "//" Line;

$icon-font-path: if($bootstrap-sass-asset-helper, "/bootstrap/", "../fonts/bootstrap/")

Result on an error, on front page. Perhaps i'm doing this step wrong, Please help. Also try downloading all the fonts files again from CDN Max, Still no luck.

What's next?

[jakeatwork]

@misterzik

I just had the same problem in RoR when I upgraded to the latest bootstrap.

Found this stackoverflow that helped fix the issue: http://stackoverflow.com/questions/18369036/bootstrap-3-glyphicons-not-working

Basically, I needed to do two things (this is for Ruby on Rails, but should be similar for you):

1) download the full bootstrap zip file and copy the fonts to my project assets directory 2) add the following to my application css file (need to adjust to your specific directory structure):

@font-face { font-family: 'Glyphicons Halflings'; src: url('../fonts/glyphicons-halflings-regular.eot'); src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg'); }

Hope that helps...my icons are working again.

[misterzik]

Thank you so much buddy, it worx now!, here it goes for people using wordpress and wondering my setup of files. Hope this help someone else.

Wordpress —> WP-CONTENT —-> Themes —--> Insanen_Theme —---> fonts (Download again from bootstrap site) —---> functions.php (Register JS and CSS) —---> javascript (bootstrap.js, bootstrap-sprockets.js) —---> sass (_bootstrap-variables.scss, styles.scss) —---> stylesheets (styles.css)

I apply the fixed posted by @jakeatwork in the following file -> sass folder -> _bootstrap-variables.scss Copy this code and paste it there:

@font-face { font-family: 'Glyphicons Halflings'; src: url('../fonts/glyphicons-halflings-regular.eot'); src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg'); }

Im using compass, Running on terminal "$compass watch" in the folder of your scss files, to save all the changes, and BOILA!

Thanks @twbs and @jakeatwork

[jakeatwork]

alright! glad it worked @misterzik!