概要 #
ビデオオブジェクトは、YouTubeなどの外部動画をページ内に埋め込むためのパーツです。
動画を活用することで、テキストや画像だけでは伝えきれない情報を直感的に伝えることができます。
自動再生やミュート、ループ再生、再生コントロールの表示・非表示など、用途に応じた柔軟な設定が可能です。
製品紹介、操作手順、メッセージ配信など幅広いシーンで効果的に活用できます。
ビデオの説明 #
ビデオオブジェクトの追加方法 #
ページに動画を挿入したい場合は、以下の手順で「ビデオ」オブジェクトを追加します。
- 左側の「オブジェクト」メニューから 「ビデオ」 を見つけます（▶マークのアイコン）。
- 「ビデオ」ボタンをクリック、またはドラッグ＆ドロップでキャンバス上の任意の位置に配置します。
- 配置後、右側の設定パネルにて以下の内容を編集できます：
- 動画URL： YouTubeやVimeoなどの外部動画URLを指定
- 再生オプション： 自動再生、ループ、ミュートなどの設定
- サイズ調整： 幅や高さをパーセンテージやピクセル単位で調整
動画コンテンツは、製品紹介、操作ガイド、メッセージ配信など多様な用途で活用可能です。
※URL形式に関する注意
動画URLは、YouTubeまたはVimeoの「埋め込み用URL」を入力してください。
通常のURL（例：https://www.youtube.com/watch?v=abc123）のままでは正しく表示されない場合があります。
▼埋め込み用URLの例：
・YouTube：https://www.youtube.com/embed/abc123
・Vimeo：https://player.vimeo.com/video/123456789
ビデオの設定項目説明 #
ビデオオブジェクトの設定項目について #
ビデオオブジェクトを選択すると、右側の設定パネルに以下の項目が表示されます。
- 素材
使用する動画プラットフォームを選択します。対応サービスは「YouTube」などです。 - URL
対象の動画URLを入力します（例：https://www.youtube.com/watch?v=…）。 - カスタムサムネイル
動画のサムネイル画像を任意の画像に変更できます。 - ビデオ幅
動画の表示サイズ（幅）をピクセルやパーセンテージで調整できます。 - 遅延読み込みモード
ページの読み込み速度を改善するため、動画の読み込みを遅らせるオプションです。
ビデオオプション #
以下のスイッチを使って、動画の再生挙動や表示設定を細かく制御できます：
- 自動再生
ページ読み込み時に動画を自動で再生させます。 - ミュート
音声を消した状態で再生します。自動再生と併用することが一般的です。 - ループ
動画を繰り返し再生します。 - プレイヤーコントロール
ユーザーに再生・一時停止などの操作ボタンを表示するかどうかを設定します。 - ロゴの非表示
YouTubeなどのロゴを非表示にします（一部サービスでは制限あり）。
カスタムサムネイルがオンの場合の項目説明 #
カスタムサムネイル設定（オンの場合） #
「カスタムサムネイル」をオンにすると、動画に対して独自のサムネイル画像を指定できるようになります。以下は設定項目の詳細です。
- ① イメージ選択
「画像を選択する」ボタンから任意の画像ファイルをアップロードまたは選択します。
この画像が動画のプレビューとして表示されます。 - ② 選択画像プレビュー
選択したサムネイル画像のプレビューが表示されます。
右上の「×」をクリックすることで画像を削除できます。 - ③ 再生ボタンを表示
オンにすると、サムネイル画像の中央に再生ボタンが重ねて表示されます。
オフにすると再生ボタンは表示されません。 - ④ アイコン選択
再生ボタンのアイコンと色をカスタマイズできます。
カラーコードで色を変更可能です。
「×」をクリックするとリセットされます。 - ⑤ LightBox
オンにすると、動画はページ遷移せずにポップアップ（モーダル）形式で再生されます。
閲覧者の操作がスムーズになるため、UX向上に効果的です。