最終更新日: 2024/08/18
せっかく掲示板では基本的に1つの投稿につき1ファイルのアップロード投稿が可能です。しかし、オプション変数を使ったアップロード機能を使用すれば、1件の投稿に複数の画像をアップロードする事が可能です。
本機能は、有料版有料版(アクティブモード)のみで稼動する機能です。
変数fileでアップロードした画像は、$iconになって表示されます。
変数$exteでは、画像の拡張子が表示されます。
変数$byteでは、画像の容量が表示されます。
変数$size_wでは、画像の横幅サイズが表示されます。
変数$size_hでは、画像の縦幅サイズが表示されます。
変数$icon_fnameでは、画像のアップロード時のファイル名が表示されます。
変数op11でアップロードした画像は、$op11になって表示されます。
変数$op11_wでは、画像op11の横幅サイズが表示されます。
変数$op11_hでは、画像op11の縦幅サイズが表示されます。
画像の変数 | 画像の横幅サイズ | 画像の縦幅サイズ | アップロード時のファイル名 |
---|---|---|---|
$op11 | $op11_w | $op11_h | $op11_fname |
$op12 | $op12_w | $op12_h | $op12_fname |
$op13 | $op13_w | $op13_h | $op13_fname |
$op14 | $op14_w | $op14_h | $op14_fname |
$op15 | $op15_w | $op15_h | $op15_fname |
オプション変数でアップロードされた画像は、画像の拡張子や画像の容量は表示出来ません。
アップロード時のファイル名初期設定ではOFFになっておりますので、ONに切り替えてください。
>> FAQ/画像のアップロード機能
上記FAQの1~5までの作業をご確認ください。
基本的な設置方法は、icon変数の設置方法と同じになります。
<input tyle="file" name="op11">
上記タグを設置する事で、ファイルの参照タグが追加されます。2つ以上設置される場合は、op11の所を別のオプション変数op12等に変更下さい。
アップロード1:<input tyle="file" name="op11">
アップロード2:<input tyle="file" name="op12">
アップロード3:<input tyle="file" name="op13">
アップロード4:<input tyle="file" name="op14">
アップロード5:<input tyle="file" name="op15">
アップロードされた画像を表示するには <img src="$op11"> などと言う風のイメージタグを挿入下さい。なお、アップロード画像が無い場合や大きな画像を縮小表示させる為にも、下記JavaScript(ジャバスクリプト)を設置下さい。
アップロード画像の変数 op11 の場合
<span id="upload$lot"></span>
<script>
var uploadspan = document.getElementById("upload$lot");
var addimg = "";
var setwidth = 150;
function openWindow(img, w, h, lot) {
var wwidth = w + 45;
var wheight = h + 30;
window.open(img, lot, "width=" + wwidth + ",height=" + wheight + ",scrollbars=yes");
}
function addImage$lot(img, w, h, lot) {
if (img !== "" && w > setwidth) {
addimg += '<a href="' + img + '" target="' + lot + '" onClick="openWindow(\\'' + img + '\\', ' + w + ', ' + h + ', \\'' + lot + '\\'); return false;">';
addimg += '<img src="' + img + '" border="0" width="'+setwidth+'" alt="IMG" style="margin:10px;">';
addimg += '</a>';
} else if (img !== "") {
addimg += '<a href="' + img + '" target="' + lot + '" onClick="openWindow(\\'' + img + '\\', ' + w + ', ' + h + ', \\'' + lot + '\\'); return false;">';
addimg += '<img src="' + img + '" border="0" alt="IMG" style="margin:10px;">';
addimg += '</a>';
}
}
IMG = "$op11";
size_w = parseInt("$op11_w") || 0;
size_h = parseInt("$op11_h") || 0;
addImage$lot(IMG, size_w, size_h, "$lot");
uploadspan.insertAdjacentHTML('beforeend', addimg);
</script>
※150ピクセルと言う縮小単位を変更する場合、青文字の150の数値を変更下さい。
複数アップロード画像を使用する場合は、追加するアップロード画像の分だけ追加して下さい。
<span id="upload$lot"></span>
<script>
var uploadspan = document.getElementById("upload$lot");
var addimg = "";
var setwidth = 150;
function openWindow(img, w, h, lot) {
var wwidth = w + 45;
var wheight = h + 30;
window.open(img, lot, "width=" + wwidth + ",height=" + wheight + ",scrollbars=yes");
}
function addImage$lot(img, w, h, lot) {
if (img !== "" && w > setwidth) {
addimg += '<a href="' + img + '" target="' + lot + '" onClick="openWindow(\\'' + img + '\\', ' + w + ', ' + h + ', \\'' + lot + '\\'); return false;">';
addimg += '<img src="' + img + '" border="0" width="'+setwidth+'" alt="IMG" style="margin:10px;">';
addimg += '</a>';
} else if (img !== "") {
addimg += '<a href="' + img + '" target="' + lot + '" onClick="openWindow(\\'' + img + '\\', ' + w + ', ' + h + ', \\'' + lot + '\\'); return false;">';
addimg += '<img src="' + img + '" border="0" alt="IMG" style="margin:10px;">';
addimg += '</a>';
}
}
IMG = "$op11";
size_w = parseInt("$op11_w") || 0;
size_h = parseInt("$op11_h") || 0;
addImage$lot(IMG, size_w, size_h, "$lot");
IMG = "$op12";
size_w = parseInt("$op12_w") || 0;
size_h = parseInt("$op12_h") || 0;
addImage$lot(IMG, size_w, size_h, "$lot");
uploadspan.insertAdjacentHTML('beforeend', addimg);
</script>
※150ピクセルと言う縮小単位を変更する場合、青文字の150の数値を変更下さい。
サーバ側にて縮小表示した物を素早く表示させる場合
アップロード画像の変数 op11 の場合
<script type="text/javascript">
<!--
var IMG = "$op11";
var size_w = "$op11_w";
var size_h = "$op11_h";
function openop11$lot() {
var wwidth = $op11_w + 45;
var wheight = $op11_h + 30;
window.open("","$lot","width="+wwidth+",height="+wheight+",scrollbars=yes");
}
if ( IMG != "" && size_w > 150){
IMG2 = IMG.replace('bbs/upfile', 'upfile/size/150');
document.write('<div align="center"><a href="'+IMG+'" target="$lot" onClick="openop11$lot()">');
document.write('<img src="'+IMG2+'" border="0" width="150" alt="IMG">');
document.write('<\\/a><\\/div>');
}else if ( IMG != ""){
document.write('<div align="center"><a href="'+IMG+'" target="$lot" onClick="openop11$lot()">');
document.write('<img src="'+IMG+'" border="0" alt="IMG">');
document.write('<\\/a><\\/div>');
}
// -->
</script>
縮小するサイズを横サイズと縦サイズ基準で指定する場合
<span id="upload$lot"></span>
<script>
var uploadspan = document.getElementById("upload$lot");
var addimg = "";
var setwidth = 150;
function openWindow(img, w, h, lot) {
var wwidth = w + 45;
var wheight = h + 30;
window.open(img, lot, "width=" + wwidth + ",height=" + wheight + ",scrollbars=yes");
}
function addImage$lot(img, w, h, lot) {
if (img !== "" && w > setwidth) {
IMG2 = IMG.replace('bbs/upfile', 'upfile/size/'+setwidth);
addimg += '<a href="' + img + '" target="' + lot + '" onClick="openWindow(\\'' + img + '\\', ' + w + ', ' + h + ', \\'' + lot + '\\'); return false;">';
addimg += '<img src="' + img2 + '" border="0" width="'+setwidth+'" alt="IMG" style="margin:10px;">';
addimg += '</a>';
} else if (img !== "") {
addimg += '<a href="' + img + '" target="' + lot + '" onClick="openWindow(\\'' + img + '\\', ' + w + ', ' + h + ', \\'' + lot + '\\'); return false;">';
addimg += '<img src="' + img + '" border="0" alt="IMG" style="margin:10px;">';
addimg += '</a>';
}
}
IMG = "$op11";
size_w = parseInt("$op11_w") || 0;
size_h = parseInt("$op11_h") || 0;
addImage$lot(IMG, size_w, size_h, "$lot");
uploadspan.insertAdjacentHTML('beforeend', addimg);
</script>
※横幅の150ピクセルと言う縮小単位を変更する場合、青文字の150の数値を変更下さい。さらに縦幅の100ピクセルを変更するときも、100のあたりを変更ください。
150-100の数値を変更することで、横幅と縦サイズを限定することが可能です。
複数アップロード画像を使用する場合は、追加するアップロード画像の分だけ追加して下さい。
<span id="upload$lot"></span>
<script>
var uploadspan = document.getElementById("upload$lot");
var addimg = "";
var setwidth = 150;
function openWindow(img, w, h, lot) {
var wwidth = w + 45;
var wheight = h + 30;
window.open(img, lot, "width=" + wwidth + ",height=" + wheight + ",scrollbars=yes");
}
function addImage$lot(img, w, h, lot) {
if (img !== "" && w > setwidth) {
IMG2 = IMG.replace('bbs/upfile', 'upfile/size/'+setwidth);
addimg += '<a href="' + img + '" target="' + lot + '" onClick="openWindow(\\'' + img + '\\', ' + w + ', ' + h + ', \\'' + lot + '\\'); return false;">';
addimg += '<img src="' + img2 + '" border="0" width="'+setwidth+'" alt="IMG" style="margin:10px;">';
addimg += '</a>';
} else if (img !== "") {
addimg += '<a href="' + img + '" target="' + lot + '" onClick="openWindow(\\'' + img + '\\', ' + w + ', ' + h + ', \\'' + lot + '\\'); return false;">';
addimg += '<img src="' + img + '" border="0" alt="IMG" style="margin:10px;">';
addimg += '</a>';
}
}
IMG = "$op11";
size_w = parseInt("$op11_w") || 0;
size_h = parseInt("$op11_h") || 0;
addImage$lot(IMG, size_w, size_h, "$lot");
IMG = "$op12";
size_w = parseInt("$op12_w") || 0;
size_h = parseInt("$op12_h") || 0;
addImage$lot(IMG, size_w, size_h, "$lot");
uploadspan.insertAdjacentHTML('beforeend', addimg);
</script>
※150ピクセルと言う縮小単位を変更する場合、青文字の150の数値を変更下さい。