せっかく掲示板

f‚̐VK쐬
TOPページ > FAQ一覧 >

FAQ/オプション変数を使って複数アップロード

最終更新日: 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変数の設置方法と同じになります。

>> FAQ/画像のアップロード機能

 

投稿フォーム(FORM編集)上には

<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">

 

記事の表示(MESSAGE編集)上には

アップロードされた画像を表示するには <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>

※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) {
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の数値を変更下さい。