wiki:icons_plugin

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
wiki:icons_plugin [2023/02/18 06:44] – removed - external edit (Unknown date) 127.0.0.1wiki:icons_plugin [2023/02/18 06:44] (current) – ↷ Page moved from contributing:icons_plugin to wiki:icons_plugin suedunham
Line 1: Line 1:
 +====== Icons plugin ======
 +
 +[[doku>plugin:icons|Icons plugin page]]
 +
 +This, by the same developer as the ''Bootstrap3'' template and [[bootstrap_wrapper_plugin]], allows for the insertion of icons from several icon libraries. **Note:** there are other ways of placing icons, such as Bootstrap Wrapper buttons having an optional icon setting directly within them.
 +
 +There are many more options available for formatting icons provided by the plugin, but the use in HârnWiki has thus far followed the KISS principle. At least, it does until the [[wrap_plugin]] and CSS get involved.
 +
 +===== Basic use =====
 +
 +For the checked box icon denoting canon [[:works:]], we use the ''mdi-checkbox-marked'' icon from the Material Design Icons library. Note how the icon syntax is just different enough than the name (and also than the Bootstrap Wrapper icon syntax) to keep one on one's toes.
 +
 +<code>
 +{{mdi>checkbox-marked}}
 +</code>
 +
 +<panel>
 +{{mdi>checkbox-marked}}
 +</panel>
 +
 +However, the default size is too big for general use, so the ''size'' parameter is employed, after a question mark, to set it to 12 pixels.
 +
 +<code>
 +{{mdi>checkbox-marked?size=12}}
 +</code>
 +
 +In some cases, one may wish to use a non-breaking space (''Alt+0160'') between the icon and the text immediately after to ensure that they stay together.
 +
 +===== Icon libraries =====
 +
 +Several icon libraries are available for use here. These aren't the very latest versions of them, but this is what the plugin provides. Presently, the most commonly used in HârnWiki are the following:
 +
 +  * [[https://fontawesome.com/v4/icons/|Font Awesome version 4.7]], ''fa''
 +  * [[https://pictogrammers.github.io/@mdi/font/4.1.95/|Material Design Icons version 4.1.95]], ''mdi''
 +  * [[https://nagoshiashumari.github.io/Rpg-Awesome/|RPG Awesome]], ''ra''
 +
 +There isn't any focus on a consistent style among the images. Just go with what communicates the idea and looks good.
 +
 +===== Particular use cases =====
 +
 +In HârnWiki icons are used in the right sidebars and navbar of the ''Works'' section and in the references there from the [[:harn:]] and other "World" sections. They are also used "under the hood" on the pages from which the ''Works'' header icons are drawn.
 +
 +==== Right sidebars and references ====
 +
 +For these roles, there are presently three icons in use, all of which are from MDI.
 +
 +^ Use ^ Code ^ Icon ^
 +| Canon works | ''%%{{mdi>checkbox-marked?size=12}}%%'' | {{mdi>checkbox-marked?size=12}} |
 +| Fanon works | ''%%{{mdi>fan?size=12}}%%'' | {{mdi>fan?size=12}} |
 +| Out-of-print works | ''%%{{mdi>grave-stone?size=12}}%%'' | {{mdi>grave-stone?size=12}} |
 +
 +The icon precedes the link to a work's page and shows what type of work it is. Canon works are those produced by [[works:publishers:cgi]] and [[works:publishers:kpl]], and fanon are those produced by others. Out-of-print works are canon works that are no longer available in that form (though this is sometimes murky when piles of old print persist in the warehouse).
 +
 +As these icons are usually used in lists, it is not necessary to follow them with a non-breaking space.
 +
 +==== Navbar ====
 +
 +The ''navbar'' page of the ''Works'' namespace uses icons for the dropdown menus in the upper left in order to take up less space than words. Things can get pretty cramped there when the Register and Login buttons are out, and the bar itself can grow and obscure the window if too many wide elements are there.
 +
 +^ Use ^ Code ^ Icon ^
 +| Realm works (from Hârn realms) | ''%%{{ra>castle-flag?14}}%%'' | {{ra>castle-flag?14}} |
 +| Other works (from Hârnic Lore works} | ''%%{{ra>scroll-unfurled?14}}%%'' | {{ra>scroll-unfurled?14}} |
 +
 +In this instance, the icons are from the RPG Awesome library, the ''ra-castle-flag'' and ''ra-scroll-unfurled'' ones, respectively. Also, the ''size='' parameter has not been explicitly included, but just providing a number will implicitly invoke it. I guess the present editor wasn't in the mood that day.
 +
 +==== Works heading icons ====
 +
 +More visibly, this plugin forms the basis of the icons over the headings of pages in the ''Works'' namespace to symbolize each documents contents. That scheme [[..icons:|is shown here]].
 +
 +===== What this doesn't do =====
 +
 +Icons also appear on a page that have nothing to do with this plugin. As mentioned above, many elements from ''Boostrap Wrapper'' have their own icon parameters. Also, DokuWiki handles the icons for outside and interwiki links.