記事に挿入した動画を編集する

この記事は最終更新日から5日経過しています。

前回のレッスン記事に動画を挿入する

記事に挿入した動画は編集することもできます。

動画の編集では、次のような項目の設定・変更ができます。

この記事では、動画の編集方法についてご紹介します。

スポンサーリンク




動画の編集画面を開く

はじめに動画の編集画面を開きます。

ビジュアルエディタで、編集したい動画をクリックします。

動画の上に編集ツールが表示されます。

編集ツールの(編集)をクリックします。

動画詳細 画面が開きます。

この画面から動画の編集をおこないましょう。

フルスクリーン再生のための別ソースを追加する

動画ソース(形式)によっては、特定のブラウザで動画が再生されないことがあります。

そのため、すべてのブラウザで動画が再生されるように、異なる動画ソースを追加することができます。

動画のソースは、次の3種類の追加が可能です。

追加できる3種類のソース

  1. MP4
  2. OGV
  3. WEBM

別ソースの追加方法を見ていきましょう。

動画詳細 画面を開きます

現在表示されている動画のソースが、プレビュー下に表示されています。

フルスクリーン再生のための別ソースを追加 で追加したい動画ソースのボタンをクリックします。

動画のソースを追加 画面が表示されます。

① 動画ソースをクリックして選択します。

動画のソースを追加 ボタンをクリックします。

動画詳細 画面に、選択したソースが追加されていることを確認します。

更新 ボタンをクリックします。

ソースを追加すると、HTMLのvideoタグにsourceタグが追加されます。

▲ 動画ソースがMP4のみの場合
▲ 動画ソースがMP4とOGVの場合

ブラウザに応じて、対応している動画ソースが再生されます。

先読みを設定する

動画の先読みの設定をおこないます。

先読みを指定することでページの更新と同時に動画の読み込みをおこなうため、動画をスムーズに視聴することができます

先読みを指定しない場合には、再生ボタンが押されると同時に動画の読み込みが始まります。

先読み で指定できる項目は次の3つです。

先読みで指定できる項目

  1. 自動
  2. メタデータ
  3. なし

① 自動

「自動」を指定すると、ページの読み込みと同時に動画全体を先読みします

▲ 「自動」を指定して動画全体を先読みする

② メタデータ

「メタデータ」を指定すると、動画のメタデータ(サイズや長さなどの情報)のみを先読みします

▲ 「メタデータ」のみを先読みする

③ なし

「なし」を指定した場合には、動画の先読みはおこないません

▲ 動画の先読みをしない

また、先読みでは、再生方法の指定もできます。

先読みで指定できる再生方法

  • 自動再生
  • 繰り返し再生

自動再生

「自動再生」にチェックを入れると、ページの読み込みと同時に動画が再生されます。

繰り返し再生

「繰り返し再生」にチェックを入れると、再生終了後にはじめに戻り、動画が繰り返し再生されます。

動画を置き換える

動画を別の動画に置き換えます。

動画詳細 画面を開きます

動画を置換をクリックします。

動画を置換 画面が表示されます。

① 置き換えたい動画を選択します。

置換ボタンをクリックします。

動画詳細 画面に戻ります。

動画が置き換わっていることを確認して、更新ボタンをクリックしましょう。

ビジュアルエディタで、動画が置換されていることを確認します。

サイトの記事内でも、置換した動画が表示されていることを確認しましょう。

ポスター画像を設定する

動画にはポスター画像(動画のアイキャッチ)を設定することができます。

ポスター画像を設定することで、動画の好きな場所をサムネイルとして見せたり、動画の内容を別の画像で表現したりといったことができます。

動画詳細 画面を開きます

ポスター画像を選択をクリックします。

ポスター画像を選択 画面が表示されます。

① ポスター画像に設定したい画像を選択します。

ポスター画像を選択ボタンをクリックします。

動画詳細 画面に戻ります。

動画にポスター画像が設定されていることを確認して、更新ボタンをクリックします。

ビジュアルエディタで、動画にポスター画像が設定されていることを確認します。

サイトの記事内でも、ポスター画像の表示を確認しておきましょう。

字幕を追加する

動画に字幕を追加することもできます。

字幕の追加には、字幕ファイル(srt)の用意が別途必要となりますので、あらかじめ用意しておきましょう。

動画詳細 画面を開きます

字幕を追加ボタンをクリックします。

字幕を追加 画面が表示されます。

① 字幕ファイル(srt)を選択します。

字幕を追加ボタンをクリックします。

動画詳細 画面に戻ります。

プレビューの再生ツールに キャプション/字幕 アイコンが表示されていることを確認して、更新ボタンをクリックします。

ビジュアルエディタの動画にも キャプション/字幕 アイコンが表示されていることを確認しましょう。

記事内の動画に字幕が表示されることを確認します。

キャプション/字幕 アイコンをクリックして、字幕メニューを選択します。(字幕メニューの表示は言語によって異なります。)

最後に、動画に字幕が追加されていることを確認しましょう。

次のレッスン動画プレイリストを作成する

WordPressの基礎を体系的に学びたい方のために

WordPressの基礎を体系的に学習したい方向けの著書が発売になります。

本書の手順に沿ってサイトを作成していただくだけで、WordPressの操作方法やサイト作成の基礎を学べる構成になっています。

これからWordPressでサイト作成を始めようと考えているけど、何から始めれば良いか迷っている。

本書はそんな方のための一冊です。

ぜひお手にとってご覧いただければ嬉しく思います。

スポンサーリンク




シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク