Awesome Asciidoc: Changing the FontAwesome CSS Location
Awesome Asciidoc: Changing the FontAwesome CSS Location
Join the DZone community and get the full member experience.
Join For FreeGet the Edge with a Professional Java IDE. 30-day free trial.
To use font icons from FontAwesome we set the document attribute icons
with the value font
. The default link to the CSS location is https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0/css/font-awesome.min.css
. We can change the location for the FontAwesome CSS with document attributes.
If we want to use a different CDN to serve the CSS we can set the document attribute iconfont-cdn
and set the URI as a value:
:icons: font // Set new URI for reference to FontAwesome CSS :iconfont-cdn: //maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css == Sample doc
To reference the FontAwesome CSS from a relative location from our generated HTML page we can first unset the attribute iconfont-remote
and set the attribute iconfont-name
:
:icons: font // First unset attribute to remotely link FontAwesome CSS :iconfont-remote!: // Specify name of FontAwesome CSS. :iconfont-name: fontawesome-4.1.0 // We can optionally set the directory where CSS is stored. :stylesdir: css == Sample doc
In the generated HTML source we see the following link
element:
... <link rel="stylesheet" href="css/fontawesome-4.1.0.css"> ...
Written with Asciidoctor 1.5.0.
Get the Java IDE that understands code & makes developing enjoyable. Level up your code with IntelliJ IDEA. Download the free trial.
Published at DZone with permission of Hubert Klein Ikkink , DZone MVB. See the original article here.
Opinions expressed by DZone contributors are their own.
{{ parent.title || parent.header.title}}
{{ parent.tldr }}
{{ parent.linkDescription }}
{{ parent.urlSource.name }}