「WikiPlus」- WEBサイトの管理・運営を簡単にするASP - WEB担当者マニュアル

画像の掲載方法 †

• 画像は、ページに表示したい画像ファイルを添付して、プラグイン「&ref」、「#ref」を使用して表示します。
• 説明用の画像は、次の画像を使用しています。

  

サイズ

150ピクセル×150ピクセル

ファイル名

cat.jpg

• 引数の詳細については、refプラグインのページを参照して下さい。

注釈、コメントの表示 †

• 画像にマウスを重ねた時の注釈・コメントを指定します。

【表示例】

【編集画面の記述】

#ref(cat.jpg,サンプル画像)

画像ファイルへのリンクを張らない †

• nolink を指定すると、画像ファイルへのリンクを張らないようになります。
• 画像だけを表示するページに飛ばなくすることができます。

【表示例】

【編集画面の記述】

#ref(cat.jpg,nolink,サンプル画像)

画像を並べて表示 †

• &refで、連続して記述すると画像が並べられて表示されます。
• デザインテンプレートで決められている幅を超えてしまう場合には、自動的に折り返します。

【表示例】

【編集画面の記述】

&ref(cat.jpg);&ref(cat.jpg);&ref(cat.jpg);&ref(cat.jpg);&ref(cat.jpg);

テキストの回り込み †

• #refに、aroundを指定して、テキストを回り込みをさせることができます。
• 回り込みの終了位置に、#clearを指定します。
• 画像位置を指定することで、右寄せも可能です。

【表示例】

• 右寄せの場合

テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。

【編集画面の記述】

#ref(cat.jpg,right,around)

テキストが回り込みます。テキストが回り込みます。・・・

#clear

【表示例】

• 左寄せの場合（位置指定がない場合は、左寄せになります）

テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。テキストが回り込みます。

【編集画面の記述】

#ref(cat.jpg,right,around)

テキストが回り込みます。テキストが回り込みます。・・・

#clear

画像の大きさ調整（ピクセル指定） †

• 100x100（幅×高さ、ピクセル） でサイズを指定します。x は英小文字のエックスです。
• zoom を指定すると元の画像の比率を維持して、指定したサイズを超えない最大の大きさで表示されます。
• #ref、&ref のどちらでも使用できます。

【表示例】

• 300×250 ピクセルに拡大、150×100ピクセルに縮小

• 幅・高さの比率を保持させる場合
• 350×250 で指定 → 250×250 で表示、150×100 で指定 → 100×100 で表示

【編集画面の記述】

&ref(cat.jpg,zoom,300x250);　300×250ピクセルに拡大
&ref(cat.jpg,zoom,150x100);　150×100ピクセルに縮小

&ref(cat.jpg,zoom,300x250);　350×250 で指定 → 250×250 で表示
&ref(cat.jpg,zoom,150x100);　150×100 で指定 → 100×100 で表示

画像の大きさ調整（倍率指定） †

• 50%、200% のように、拡大縮小率を指定することもできます。
• #ref、&ref のどちらでも使用できます。

【表示例】

• 200%に拡大、80%に縮小

【編集画面の記述】

&ref(cat.jpg,200%);　200%に拡大
&ref(cat.jpg,80%);　 80%に縮小

ページでの表示は小さくして、クリック時に拡大画像を表示させる。 †

• 添付する画像ファイルは、拡大時に表示させたい大きさのものを添付します。
• 表示サイズを指定します。
• 使用している画像のデータ：ファイル名 cat2.jpg、元のサイズ 640×480

【表示例】

• クリックすると元サイズの画像を表示するページに移動します。

【編集画面の記述】

#ref(cat2.jpg,zoom,150x100,クリックすると拡大画像を表示します)

画像にリンクを張る †

【表示例】

• サイト内リンクは、[[&ref (ファイル名); > ページ名 ]] で指定します。

• 外部リンクをする場合には、URLを指定します

【編集画面の記述】

[[&ref(cat.jpg,nolink,WikiPlusマニュアルのTopページにリンクします);>Top]]

[[&ref(cat.jpg,nolink,ジャストプレイヤーのコーポレートサイトにリンクします);
>http://www.justplayer.co.jp]]