アイコンプラグイン
この拡張は二年以上更新されていません。もはや維持管理や対応がされておらず、互換性に問題がある可能性があります。
This extension is not in the 'plugin' or 'template' namespace and is therefore ignored.
類似 fontawesome, icon
インストール
オプションの外部要件: このプラグインは、個別にインストールする必要のある次の追加コンポーネントが必要です:
プラグイン管理とプラグインの最新バージョンを示す上記のダウンロードURLを使用して、プラグインをインストールします。 手動でプラグインをインストールする方法についてはプラグインを参照してください。
使用例・使用方法
動作中のプラグインはここを参照して下さい。 使用例ページは、プラグインで使用可能なすべてのスタイルを表示しています。
簡単な使用方法:
{{icon>house}}
より複雑な使用例:
{{icon>home?24&circle&padding=10px&background=#DDD&color=#CCC}} {{fa>home|My Home}} {{fugue>user?24}} {{silk>anchor}} {{flag>en}} [[:wiki:welcome|{{fa>home?24|Welcome to DokuWiki}}]] [[https://github.com/LotarProject/dokuwiki-plugin-icons|{{fa>github-square?24|Icons DokuWiki plugin on GitHub}}]]
構文
基本構文
{{icon>icon-name&flags|title}}
DokuWiki リンク構文
[[:dokuwiki:page|{{icon>icon-name&flags|title}}]]
外部リンク構文
[[protocol://host/path|{{icon>icon-name&flags|title}}]]
利用可能なアイコン集
アイコン集 | |
---|---|
icon | デフォルトアイコン集(defaultPack オプションを参照) |
fa | Font Awesome |
glyphicon | Glyphicons |
typcn | Typicons |
fugue | Fugue |
oxygen | KDE Oxygen |
設定
管理者メニューにある DokuWiki の設定管理でプラグインの設定ができます。
設定オプション | デフォルト値 | 説明 |
---|---|---|
defaultSize | 16 | サイズが指定されていない場合のデフォルト値 |
defaultPack | fa | 指定されていない場合のデフォルトアイコン集 |
loadFontAwesome | On | Font Awesome: CSS の読込みの許可・禁止(Bootstrap3 ベースのテンプレートの場合、不可) |
fontAwesomeURL | (CDN URL) | Font Awesome CDN or local URL |
loadTypicons | On | Typicons: CSS の読込みの許可・禁止 |
typiconsURL | (CDN URL) | Typicons CDN or local URL |
fugueURL | (CDN URL) | Fugue CDN or local URL |
oxygenURL | (CDN URL) | KDE Oxygen CDN or local URL |
silkURL | (CDN URL) | Silk CDN or local URL |
flagURL | (CDN URL) | Flag CDN or local URL |
Flag アイコン集のための注意:デフォルトでは、Dokuwiki 内に存在する Translation plugin の flag を利用します。
変数
変数 | 値 | 説明 |
---|---|---|
size | (defaultSize オプションを参照) | アイコンサイズ(ピクセル単位) |
pack | (defaultPack オプションを参照) | アイコン集 (fa, glyphicon, fugue, oxygen) |
circle | - | アイコンの周囲に circle を作成 |
border | - | アイコンの周囲に境界線を追加 |
borderColor | - | 境界線の色設定 |
padding | - | アイコンに余白を適用(ピクセル単位) |
background | - | アイコンに背景色を適用(16進数か色名) |
color | - | アイコンに色を適用(16進数か色名) |
class | - | アイコンに CSS クラスを追加(Font Awesome や Glyphicon で便利) |
align | left|center|right | アイコンの配置(left・right・ center) |
left | - | アイコンを左寄せ |
right | - | アイコンを右寄せ |
center | - | アイコンを中央揃え |
Font Awesome 変数
変数 | 値 | 説明 |
---|---|---|
lg | - | アイコンサイズを 33% 拡大 |
2x|3x|4x|5x | - | アイコンサイズを拡大 |
border | - | アイコンに境界線を追加 |
spin | - | 回転動作を追加 |
pulse | - | 脈動動作を追加 |
rotate | 90|180|270 | アイコンを回転する |
flip | horizontal|vertical | アイコンを反転する |
pull-left | - | 左にアイコンを引き出す |
pull-right | - | 右にアイコンを引き出す |
デモ
デモと使用例は、http://www.lotar.altervista.org/dokuwiki/wiki/plugin/icons にあります。
開発
変更履歴
- Merge branch 'develop' by giterlizzi (2019-08-27 00:32)
- Replaced "material" icon pack with "mdi" icon pack by giterlizzi (2019-08-27 00:31)
- Updated .travis.yml by giterlizzi (2018-05-23 16:25)
- Updated .travis.yml by giterlizzi (2018-05-23 16:19)
- Merge branch 'master' into develop by giterlizzi (2018-02-28 16:18)
既知のバグと問題点
バグ報告と機能要望はバグ追跡システムにお願いします。
ToDo と要望一覧
ADD: New configuration option to change the Fugue CDN URLADD: New configuration option to change the Oxygen CDN URL
FAQ
携帯用の DokuWiki に Font Awesome や Glyphicon をインストールする方法
最初に Font Awesome パッケージをダウンロードし、DokuWiki 内にインストールディレクトリ(例:assets/font-awesome
)を作成し、全ファイルを配置します。
次に設定管理内で loadFontAwesome
を有効にし、fontAwesomeURL
に Font Awesome パッケージのローカル URL(例:/dokuwiki/assets/font-awesome/css/font-awesome.min.css
) を入力します。
代替案は、Font Awesome と Glyphicon を同梱したテンプレート(Bootstrap3 テンプレート)を使うことです。