I had a small problem yesterday when I was upgrading from Bootstrap 2.3 to Bootstrap 3 on one of my rails applications. All was okay on my laptop, icons were loading without a problem but later when I checked my site on a mobile device I saw that the Glyphicons were showing up as Emojis. It wasn’t just my device, I asked my friends to have a look and to their amusement they seemed to have the same issue. The fix? When upgrading to Bootstrap 3 I needed to change the paths of the fonts/glyphicons locations. So we had:
font-family: ‘Glyphicons Halflings’;
src: url(‘../fonts//glyphicons-halflings-regular.eot?#iefix’) format(’embedded-opentype’), url(‘../fonts//glyphicons-halflings-regular.woff2’) format(‘woff2’), 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’);
I had to change the path ../fonts/ to ./assets/ but I only changed the first couple, not all of them (as it was on one line in my editor I didn’t see them all). So by changing all the paths to the correct ./assets/ path the issue was resolved.