画像をアップロードする
画像をアップロードするカスタムフィールドついて詳しく説明します。
以下で説明しているファイルのカスタムフィールドは、ソースコードの生成はカスタムフィールドメーカーで簡単に作成できます。
画像をアップロードするカスタムフィールドの作成
例）PNGファイルをアップロードするカスタムフィールド（フィールド名：topVisual）
<!-- アップロード済みのファイルのプレビューエリア -->
<!-- BEGIN topVisual@path:veil -->
<img src="%{ARCHIVES_DIR}{topVisual@path}" width="{topVisual@x}" height="{topVisual@y}" alt="{topVisual@alt}" /><br />
<input type="hidden" name="topVisual@old" value="{topVisual@path}" />
<input type="hidden" name="topVisual@secret" value="{topVisual@secret}" />
<label for="input-checkbox-topVisual@edit">
<input type="checkbox" name="topVisual@edit" value="delete" id="input-checkbox-topVisual@edit" />
削除
</label><br /><!-- END topVisual@path:veil -->
<!-- イメージファイルをアップロードするフィールド -->
<input type="file" name="topVisual" size="20" />
<input type="hidden" name="field[]" value="topVisual" />
<input type="hidden" name="topVisual:extension" value="image" />
<input type="text" name="topVisual@alt" value="{topVisual@alt}" />
<input type="hidden" name="topVisual@extension" value="png" />
<input type="hidden" name="topVisual@filename" value="topVisual.png" />
<input type="hidden" name="topVisual@width" value="820" />各記述の説明
3行目：アップロードした画像の表示【必須】
標準サイズ：normal / 画像（小）：tiny / 画像（大）：large 正方形サイズ（v.1.5.0より追加）：square / 画像（正方形）
例）各画像サイズの記述例
<!-- BEGIN フィールド名@normal:veil --><img src="%{ARCHIVES_DIR}{フィールド名@path}" width="{フィールド名@x}" height="{フィールド名@y}" alt="{フィールド名@alt}" /><!-- END フィールド名@normal:veil --><br />
<!-- BEGIN フィールド名@tiny:veil --><img src="%{ARCHIVES_DIR}{フィールド名@tinyPath}" width="{フィールド名@tinyX}" height="{フィールド名@tinyY}" alt="{フィールド名@tinyAlt}" /><!-- END フィールド名@tiny:veil --><br />
<!-- BEGIN フィールド名@large:veil --><img src="%{ARCHIVES_DIR}{フィールド名@largePath}" width="{フィールド名@largeX}" height="{フィールド名@largeY}" alt="{フィールド名@largeAlt}" /><!-- END フィールド名@large:veil --><br />
<!-- BEGIN フィールド名@square:veil --><img src="%{ARCHIVES_DIR}{フィールド名@squarePath}" width="{フィールド名@squareX}" height="{フィールド名@squareY}" alt="{フィールド名@squareAlt}" /><!-- END フィールド名@square:veil --><br />4行目：画像がアップロードされなかった場合に既存のアップロードされている画像の情報を送信する記述【必須】
<input type="hidden" name="フィールド名@old" value="{フィールド名@path}" />6〜9行目：アップロードしてある画像を削除する記述【任意】
<label for="input-checkbox-フィールド名@edit"> <input type="checkbox" name="フィールド名@edit" value="delete" id="input-checkbox-フィールド名@edit" /> 削除 </label>
11行目：ファイルを入力する記述【必須】
<input type="file" name="フィールド名" />
12行目：画像のカスタムフィールドであることの記述【必須】
<input type="hidden" name="field[]" value="フィールド名" />
13行目：通常のフィールドではなく、拡張フィールドであることの記述【必須】
<input type="hidden" name="フィールド名:extension" value="image" />
14行目：altの指定【任意】
<input type="text" name="フィールド名@alt" value="{フィールド名@alt}" />15行目：アップロードする画像の拡張子を指定【任意】
拡張子を指定し、画像の形式も自働的に変換されます。
<input type="hidden" name="フィールド名@extension" value="拡張子" />
16行目：アップロードする場所とファイル名を指定【任意】
カスタムフィールドからアップロードされた画像は、/archives/bid/内に格納されます。（その他の場所にはアップロードできません。）
<input type="hidden" name="フィールド名@filename" value="アップロードする画像のパス" />
17行目：アップロードする画像の大きさを指定【任意】
幅（width）と高さ（height）を指定します。幅と高さどちらかを指定すると指定した大きさを元に縦横比に合わせて画像がリサイズされます。「size」は画像の長辺を指定します。
<input type="hidden" name="フィールド名@width" value="画像の幅の数値" /> <input type="hidden" name="フィールド名@height" value="画像の高さの数値" /> <input type="hidden" name="フィールド名@size" value="画像の長辺の数値" />
画像（小）と（大）と（正方形）の大きさを指定することもできます。指定した場合にのみ、画像（小）と（大）と（正方形）の画像が作成されます。 ※正方形画像はv.1.5.0から使用できる機能です。
- 画像（小）の場合
- tinyWidth, tinyHeight, tinySize
- 画像（大）の場合
- largeWidth, largeHeight, largeSize
- 画像（正方形）の場合
- squareWidth, squareHeight, squareSize
例）各画像サイズの記述例
<input type="hidden" name="フィールド名@width" value="画像の幅の数値" /> <input type="hidden" name="フィールド名@height" value="画像の高さの数値" /> <input type="hidden" name="フィールド名@size" value="画像の長辺の数値" /> <input type="hidden" name="フィールド名@tinyWidth" value="画像（小）の幅の数値" /> <input type="hidden" name="フィールド名@tinyHeight" value="画像（小）の高さの数値" /> <input type="hidden" name="フィールド名@tinySize" value="画像（小）の長辺の数値" /> <input type="hidden" name="フィールド名@largeWidth" value="画像（大）の幅の数値" /> <input type="hidden" name="フィールド名@largeHeight" value="画像（大）の高さの数値" /> <input type="hidden" name="フィールド名@largeSize" value="画像（大）の長辺の数値" /> <input type="hidden" name="フィールド名@squareWidth" value="画像（正方形）の幅の数値" /> <input type="hidden" name="フィールド名@squareHeight" value="画像（正方形）の高さの数値" /> <input type="hidden" name="フィールド名@squareSize" value="画像（正方形）の長辺の数値" />
※Widthでは横の長さを、Heightでは縦の長さを、Sizeでは長辺を基準にして指定することができます。