Wiki編集用ページ:画像

Last-modified: 2025-12-05 (金) 14:53:00

目次

概要

編集者用のページです

本wiki開設当初はFrontPageに直接画像を添付していましたが、より使いやすくするため、ページ間共通で使用される画像の添付専用のページとして本ページを設置しました。
汎用的なアイコン等の画像はこのページに「添付」してください。

  • 各ページで画像を張り付ける手間を省く
  • 画像のあるページを探す手間を省く

このページ内の画像

  • アイコン:100~150px程度のサイズです。このページの一覧では縮小して表示しています。
  • 画像のファイル名に半角の括弧は使用しないでください(後述するiconプラグインでの使用のため)。また、半角スペースも基本的に非推奨です。
    • 名前の区切りには「_」(アンダースコア)推奨、「-」も可。
    • 全角括弧は、ゲーム内テキストで使徒名に使われている場合など、理由があれば使用可です。
      • ❌️「◯◯(かっこいい)_高学年スキル.webp」←半角括弧
      • ⭕️「◯◯(かっこいい)_高学年スキル.webp」←全角括弧
  • 画像のファイル形式はできればwebp、もしくはpngにしてください。
    (webpが最も軽さと画質のバランスが良いため)
  • 画像の編集・webpの書き出しは自前の画像編集ソフトを使うほか、GoogleのブラウザアプリSquooshで簡単に行えます。
    操作方法
    1. 元の画像をアップロード
    2. Compressから変換したいファイル形式に対応した圧縮方式を選択
    3. 必要であればResizeのトグルをONにして調節
    4. 右下のボタンからダウンロード

画像サイズサンプル

24x24butter_2.webpkomi_2.webp文中に文字の補助としてアイコンを使いたい時など。
キャラアイコンは判別が難しくなるので非推奨
48x48butter_2.webp一覧表で使ったとき
だいたい2行分
60x60butter_2.webp一覧表で
使ったとき
だいたい3行分
90x50butter_2.webp登場した使徒で使っているサイズ。

画像の差し替えについて

WikiWikiには画像を差し替える仕様がありません。一度削除して再アップロードしてください。

  • 間違えた名前で添付してしまった
    • そのページの上部にある「添付」ページを開く
    • 「ファイル(画像)を貼り付けるの添付ファイル一覧」の「差し替えたいファイル名.拡張子[詳細]」の[詳細]ページを開く
    • 「このファイルを削除します。」のラジオボタンを選択して「実行」ボタンを押す
  • 画像を間違えて添付した
    上記の方法のあと、再度画像を添付してください。

画像使用方法1 refプラグインを使う

画像を呼び出す最も直接的な方法はrefプラグインの使用です。

&ref(画像/画像の名前.webp,nolink,24x24※任意のサイズ);

アイコン類

アイコン類、元サイズは基本128×128

&ref(画像/名称.webp,nolink,サイズ)
キャンディ.webpスターキャンディ.webpエリーフ.webpゴールド.webpよくできました!.webpバトルジェム.webp
キャンディスターキャンディエリーフゴールドよくできました!バトルジェム
モカロン.webpシューカロン.webp★1共同教団証.webp教団証.webp
モカロンシューカロン★1共同教団証教団証
ガードの下級マシュマロ.webpアタッカーの下級マシュマロ.webpサポーターの下級マシュマロ.webp
ガードの下級マシュマロアタッカーの下級マシュマロサポーターの下級マシュマロ
ガードの中級マシュマロ.webpアタッカーの中級マシュマロ.webpサポーターの中級マシュマロ.webp
ガードの中級マシュマロアタッカーの中級マシュマロサポーターの中級マシュマロ
ガードの上級マシュマロ.webpアタッカーの上級マシュマロ.webpサポーターの上級マシュマロ.webp
ガードの上級マシュマロアタッカーの上級マシュマロサポーターの上級マシュマロ
下級クレヨン.webp中級クレヨン.webp上級クレヨン.webp特級クレヨン.webp
下級クレヨン中級クレヨン上級クレヨン特級クレヨン
上級精錬石.webp装備の定石.webp
上級精錬石装備の定石
使徒募集チケット.webpカードガチャチケット.webp教団成長材料箱.webp教主の部屋を飾る材料箱.webp教団料理箱.webp
使徒募集チケットカードガチャチケット教団成長材料箱教主の部屋を飾る材料箱教団料理箱

画像使用方法2 iconプラグインを使う

iconプラグイン概要

refに加えて、iconプラグインを使う方法もあります。

&icon(サイズ, key);
  • 利点
    • refより短く済む。
    • 画像のファイル名を直接使用しないので、共通化を使用しやすい。
      wikiwikiでは画像名を変更するのは削除→再アップロードしかないので手間がかかるが、こちらはキー名と画像を管理するページを編集するだけで良いので管理が楽。
    • CSSスプライトという技術により、ページが軽量化する場合がある
      ただしこの点については、近年の環境では使わない場合とそこまで大差はないという説もある。
  • 欠点
    • iconページに画像を登録してからでないと使用できない&サイズ指定できない。

使用例

完全なリストは下記のページを参照。

:config/plugin/icon/24
:config/plugin/icon/48

なお、半角括弧の不使用やリソース共通化のため、キー名が前述のrefの例と変わっているものがあります。

&icon(24,妖精);

妖精

&icon(24,妖精_色);

妖精_色

&icon(24,攻撃);

攻撃

&icon(24,純粋);

純粋

&icon(48,イチゴケーキ);

イチゴケーキ

&icon(48,肉体労働);

肉体労働

&icon(48,エルフィン_高学年スキル);

エルフィン_高学年スキル

設定方法

:config/plugin/iconの下層にページを作成し、以下の記述をすることで追加可能。
ページ名は、わかりやすさのためアイコンのサイズ数にすると良い。

*サイズ
|width|height|pixel perfect|h
|【数値】|【数値】|0|
 
*画像ソース
|key|ref|h
|【テキスト】|&ref(【画像アドレス】);|
width
height
アイコンサイズを指定。
pixel perfect
0:大きな画像をブラウザ側で縮小表示、鮮明に見せる処理が行われる
1:縮小表示せず、指定されたサイズでアイコンを表示
特に理由がなければ0でOK
key
任意のアイコン呼び出しキー名。重複不可。
refと違い半角括弧は使用可能だが、まぎらわしいため非推奨。
ref
表示する画像を&ref;プラグインで指定。
おそらくファイル名に半角括弧は使用不可(全角括弧は使用可)。
ファイル名に半角括弧が入った画像を引用しようとすると、空白画像が表示される。

参考サイト

以上のiconプラグインについては、下記のサイトを参考にさせて頂いております。感謝申し上げます。

キャラスタンプ

gif→webpに変更中