I'm brand new to BS. I am retrieving v3.3.6 of the Bootstrap CSS and JS files from MaxCDN. I was hoping there would be a way to include the glyphicons as well but I can't see how to do that. Is it possible to retrieve the glyphicons from a CDN?
Also, I do not understand what the Bootstrap download page means when it refers to "Precompiled Bootstrap" Why would I want the precompiled download vs. the MaxCDN download. I see the precompiled provides the glyphicons so maybe that's the only reason.
Where to find Glyphicons? Associated CSS rules are present within bootstrap. css and bootstrap-min. css files within css folder of dist folder.
You don't have to do anything 'special' to load Bootstrap Glyphicons, except make sure your folder structure is set up appropriately. Note, you need both classes. The first class glyphicon sets up the basic styles while glyphicon-comment sets the specific image. I would just add one more thing.
Free Alternatives to Glyphicons You can use both Font Awesome and Github Octicons as a free alternative for Glyphicons. Bootstrap 4 also switch from Less to Sass so you might integrate the font's Sass (SCSS) into your build process, to create a single CSS file for your projects.
If you include the stylesheet bootstrap.min.css
in your HTML file like this (for example):
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" type="text/css" rel="stylesheet">
Then the Glyphicons font(s) will automatically be downloaded from the same location:
//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/fonts/glyphicons-halflings-regular.eot
//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/fonts/glyphicons-halflings-regular.svg
//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/fonts/glyphicons-halflings-regular.ttf
//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/fonts/glyphicons-halflings-regular.woff
//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/fonts/glyphicons-halflings-regular.woff2
This is because the fonts are loaded using relative URLs. When the CSS in bootstrap.min.css
is parsed, the URL from which it was downloaded is used as the base, not your website's URL.
With regards to precompiled Bootstrap: This is useful if you want to host the files on your own web server (for some reason). They are made available as a zip file containing the correct directory structure required for the above behaviour to function correctly out of the box. It's labelled as precompiled, because you could alternatively download the source files. Although CSS and JavaScript files are considered source files in their own right, Bootstrap uses a precompiler on its CSS to make it easier for them to write the large files. They also use several smaller JavaScript files which are merged together for release by a build script. You can see this in action at their GitHub repository.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With