『備忘録』カテゴリーの投稿一覧

ブログ小休止のお知らせ


 私事で恐縮ですが五つ違いの姉が入院加療中のところ、本日78歳にて永眠いたしました。つきましては当ブログの更新は当分の間お休みいたします。ブログへ記載すべきか迷ったのですが、備忘録を兼ねているので書き留めることにしました。ご了承ください。

ブログ記事への動画挿入手順


JW Player for WordPressプラグインによる動画の挿入手順。
「ikuzus-h 雑記帳」はレンタルサーバーに WordPressというブログソフトウェアを使用して作成しています。写真などの静止画はそのまま投稿にアップロードしてから挿入できますが、動画の場合はパソコンの環境やWeb browserによっては再生出来ないことが発生します。そこで、JW Player for WordPressプラグインをインストールして動画挿入を検証。
 WordPress管理画面の投稿からアップロード出来るファイルのサイズの上限が2MB。そこでファイル転送ツールでレンタルサーバーに直接転送しておくなど結構面倒なので、動画の挿入手順をまとめてみました。
 
1. JW Player for WordPressプラグインのインストール。
 WordPressの管理画面からプラグインを検索しインストールします。
img_JW00
 
2. 動画ファイルの作成。
 今回は EDIUS 6で動画編集と AVIファイルの作成後、TMPGEnc 4.0 で mp4ファイルにエンコード。動画サイズは Full HD(1920×1080)(画像クリックで拡大表示)
img_JW01
 
3. 動画ファイルをサーバーに転送。
 WordPressがアップロード出来るファイルのサイズ上限は2MBなので、容量の大きな動画は別途ファイル転送ツールでサーバーに転送。今回は Homepage Builderの転送ツールを使用。  
img_JW02
 
4. サーバーに転送した動画を WordPressで使用できるようにする。
 WordPressの管理画面から[投稿]→[アップロード/挿入]アイコンをクリックしメディアを追加する。
img_JW03
 [メディアを追加]から[External Media]をクリックし、転送ツールでサーバーに転送した動画ファイルの URLを入力し[メディアを追加]をクリックする。
img_JW04
 管理画面から[メディアライブラリ]で追加した動画ファイルの[編集]をクリックする。
img_JW05
 [メディアを編集]でタイトル、説明を記入。ファイルの URLをコピー、Download file欄へペースト後[メディアを更新]をクリックする。
img_JW06
 
5. JW Playerのカスタマイズ
 JW Player挿入時のサイズやプレイリストの有無などをカスタマイズする。
5-1. プレイリスト無しの設定例
 管理画面から[JW Player]をクリックし[Create Custom Player]をクリックする。
img_JW18
[Basic Settings]で Selected Player: skin: height: width: などを入力する。
img_JW13
 [Advanced Settings]をクリックし playlist position: streching: などを入力し[Save]をクリックする。
img_JW14
 WordPressの管理画面から[投稿]→[アップロード/挿入]アイコンをクリックする。
img_JW03
 [メディアを追加]から[メディアライブラリ]をクリックし挿入する動画を開き、Selected Playerでプレイリスト無しの設定を選択後[Insert JW Player]をクリックする。
img_JW15
 投稿記事欄に動画入りの JW Playerが挿入される。[プレビュー]をクリックすると挿入した動画を確認できる。
img_JW16
 プレイリスト無しの JW Playerが挿入された動画。再生アイコンクリックで動画スタート。コントロールバーの拡大アイコンを押すとフルスクリーンなります。

[jwplayer config=”Player-600_list-non” mediaid=”13182″]
 
5-2. JW Playerの右にプレイリスト有りの設定例
 管理画面から[JW Player]をクリックし[Create Custom Player]をクリックする。
img_JW18
[Basic Settings]で Selected Player: skin: height: width:(playlist込み) などを入力する。
img_JW07
 [Advanced Settings]をクリックし playlist position: streching: などを入力し[Save]をクリックする。
img_JW08
 管理画面から[メディア]→[Pleylists]をクリック。JW Player Plugin Playlist Managerで New Playlist:を入力後[Create Pleylist]をクリックする。右欄の Media Listからリストアップしたい動画を選択し、左欄へドラッグ アンド ドロップし[保存]をクリックする。(画像クリックで拡大表示)
img_JW09
 WordPressの管理画面から[投稿]→[アップロード/挿入]アイコンをクリックする。
img_JW03
 [メディアを追加]から[Pleylists]をクリック。Selected Playlist:でプレイリストを選択、Selected Player:でプレイリスト有りの設定を選択後[Insert JW Player]をクリックする。
img_JW10
 投稿記事欄に右にプレイリスト有りの JW Playerが挿入される。[プレビュー]をクリックすると挿入した動画を確認できる。
img_JW11
 JW Playerの右にプレイリストが挿入された動画。プレイリストか再生アイコンクリックで動画スタート。コントロールバーの拡大アイコンを押すとフルスクリーンなります。
[jwplayer config=”Player-600_list-right” playlistid=”13186″]

カレンダー

2024年3月
 12
3456789
10111213141516
17181920212223
24252627282930
31  

記事の月別アーカイブ

▲Pagetop