CODEWITHSUNDEEP
htmlmavenmaven-pluginasciidoc
rocksteady
rocksteady

Reputation: 2550

How to enable (custom) admonition icons when converting asciidoc to html5 using the maven plugin

I use the asciidoctor-maven-plugin(1.5.3) to convert asciidoc files to pdf and html files.

Problem:

The pdf file that is created is rendered including the admonition icons - So, all is well here.

The html file on the other hand does not seem to be created in the right way - the admonition icons are missing. There is no text/caption instead just a strange placeholder.

I tried using the :icons: font backend attribute, where font is the only option I found in the asciidoc documentation. (By the way this is the same as adding <icons>font</icons> like shown below in the pom.xml.)

The font option should show icons from http://fortawesome.github.io/Font-Awesome/icons/ but it does not.

Question:

Do I have to import those icons form anywhere or dowload them and specifically include them using the :iconsdir: path/to/icons backend attribute?

The important part of the pom.xml looks like this.

<configuration>
    <backend>html5</backend>
    <sourceHighlighter>coderay</sourceHighlighter>
  <attributes>
    <imagesdir>./images</imagesdir>
    <toc>left</toc>
    <icons>font</icons> 
    <sectanchors>true</sectanchors>
    <idprefix/>
    <idseparator>-</idseparator>        
  </attributes>
</configuration>

Upvotes: 2

Views: 1810

Answers (1)

rocksteady
rocksteady

Reputation: 2550

Ok, this is embarrassing, at least one half of the story.

  1. The embarrassing part

The actual mistake I made was using the noscript firefox plugin, which disallowed the use of fontawesome....

In fact, I had to explicitly allow cloudfare.com in noscript to make it work.

So, my pom.xml stays with the attribute <icons>font</icons>.

  1. The good part

I found out how to use custom icons:

  • declare <iconsdir>./images/icons</iconsdir> (This is also the default, relative to the source directory.)
  • copy some icons in it. I got them from here. (Pay attention to the names: note.png for NOTE: This is a note.)
  • change <icons>font</icons> to <icons>image</icons>

Upvotes: 1

Related Questions