動画・音声のアップロードについて
詳しい使い方解説
2018/12/06のバージョンより、動画・音声のアップロードが可能となりました。
動画・音声フォーマットはHTML5環境がないと閲覧できません。
一部の古いブラウザでは閲覧できません。
サーバーごとに、容量やアップロード数等の制限があります。
例えば、「アップロード数の制限」「１枚のアップロード容量制限」「全体のアップロード容量制限」など、ほとんどのサーバーでは様々な制限があります。必ず「試用版」を使ってご予定のファイルのアップロードが全て可能かご確認下さい。
php.iniの編集で設定変更ができる場合もあります。サーバー会社に直接ご相談下さい。
動画・音声の種類によってはブラウザで閲覧できないものもあります。
外部サイトになりますが、WEB上で無料で変換してくれるサイトもありますので活用してみて下さい。
▼Convertio様
ビデオコンバータ：https://convertio.co/ja/video-converter/
オーディオコンバータ：https://convertio.co/ja/audio-converter/
画面中央の赤いボタンからファイルをアップロードし、変換したいフォーマットを指定してダウンロードできます。
↓クリックすると試用版のサンプルページが開きます。
動画・音声をアップロードできるのは、「ファイル１」〜「ファイル５」までです
管理ページの左メニュー「項目設定」をクリックし、出てきた物件一覧の編集ボタンを押した先のページにあります。
試用版では、「ファイル4」と「ファイル5」を使えるように、それぞれ「動画」「音声」と以下のように名前を入力しています。
※名前はわかりやすいように変更して構いません。
データ入力画面を見てみましょう
試用版の場合、サンプルデータの「売買物件E」を開いてみると、以下のように動画と音声が登録されているのがわかります。
動画・音声が出力されるitem.htmlを見てみましょう
実際にホームページとして出力されているのが冒頭で紹介したサンプルページです。
動画・音声を出力させているページはitem.htmlになりますが、こちらのタグを詳しく見てみましょう。
■「ファイル4」の場合だと、
<!--{def item/file4}-->
<video controls="" src="user_data/{val item/file4_file/save_name}" width="400">video</video><br>
<!--{/def}-->
の３行が実際の出力に関係する部分です。
１行目と３行目は、「もしファイル4(file4)の情報が入力されている場合、その間のタグを出力させる」という指定です。データが未入力であれば見出し（動画）含めてこのブロックは出力されません。
■「ファイル5」のブロックは、
上の動画タグで「file4」だった部分が「file5」になり、動画の<video>に代わり、音声を出力させる<audio>というタグになった点が異なるだけです。「file5」という文字列はこの場合は２箇所あるので両方間違えずに入力して下さい。
<video>は動画を、<audio>は音声を出力させるタグです。
動画タグの方で、「width="400"」と幅を直接指定していますが、ブラウザ幅に合わせたい場合は、cssフォルダのstyle.cssの冒頭にある、
iframe {width: 100%;}
を、以下にすればOKです。
iframe,video {width: 100%;}
補足：
2018/12/06以降に配布されているテンプレートだと、その上の行にvideo {max-width: 100%;}とありますが、下の行でiframe,video {width: 100%;}とする事で指定が上書きされるので影響ありません。
max-widthというのは、配置するもの(この場合は動画)の原寸が表示領域より小さい場合はそのサイズのままで、配置するものの原寸が表示領域より大きい場合は表示領域に合わせてサイズを変化させる指定です。