To fix the issue you can do I usually use the icomoon app to convert svg files into a typeface. PNG would not give you the best result, you need to get the image source either AI or other vector sources, convert them into svg and feed it into this app and you can get your font.
Bootstrap Glyphicons not rendering using local Bootstrap version
hope this fix your issue As I was writing the question, I figured it out. In your bootstrap theme file, look for these lines:
//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
//** Load fonts from this directory.
// [converter] If $bootstrap-sass-asset-helper if used, provide path relative to the assets load path.
// [converter] This is because some asset helpers, such as Sprockets, do not work with file-relative paths.
$icon-font-path: if($bootstrap-sass-asset-helper, "bootstrap/", "../fonts/bootstrap/");