【初心者向け】Studioで動画を埋め込む方法を徹底解説!
「Youtubeの動画を埋め込む方法が知りたい」 「動画の再生時間を指定したい」
そんな悩みを持つ方も多いのではないでしょうか。
この記事では、Studio内に動画を埋め込む方法を解説していきます。
YoutubeとVimeoに分けてご紹介しますので、ぜひ最後までお読みください。
- StudioでYoutube動画を埋め込む方法
- StudioでVimeo動画を埋め込む方法を
- おすすめの埋め込み方法
「ノクステック」では、StudioExpertsに加盟しているプロによるホームページ制作を行っております。
ホームページ運用でお困りではありませんか?
✅名刺代わりのサイトが欲しいけど50~100万円も予算がない
✅WordPressからの乗り換えを検討している
✅自分で管理・更新できるサイトが欲しい
上記のようなお悩みがありましたら、お気軽にノクステックにご相談ください。
豊富な経験を持つノーコードのプロが直接サイト制作を担当いたします。
Youtube動画を埋め込む方法
Youtubeに動画をアップロードする
まずはYoutubeの管理画面であるYoutube Studioから動画をアップしましょう。
Youtube Studio内にある「作成」を選択し、「動画をアップロード」を選択しましょう。
その後、アップロードしたい動画を追加し、各種設定を行った後「公開」を行いましょう。
Youtubeから埋め込みコードを取得
動画公開後、埋め込みコードを取得します。
埋め込みコードの取得は、「共有」を選択することで行うことができます。
メニューの中にある「埋め込む」を選択します。
「コピー」を選択することで埋め込みコードをコピーすることができます。
ここでは動画の開始時間を指定することができるので、お好みで設定すると良いでしょう。
StudioにYoutubeパーツを配置
埋め込みコードが取得できたら、Studio内にYoutubeパーツを配置しましょう。
左パネルを開き、「追加」→「ボックス」→「Embed」→「Youtube」を選択し、編集画面上にドラッグ&ドロップします。
動画の埋め込みコードを追加
Youtubeパーツが配置できたら、先程取得した動画の埋め込みコードをiframeにペーストしましょう。
正しくコードを追加できた場合には、動画のサムネイルが表示されます。
Vimeo動画を埋め込む方法
Vimeoに動画をアップロードする
まずはVimeoにアクセスし、アカウントを作成しましょう。
アカウントが作成できたら、「Upload」ボタンから動画をアップロードします。
「Choose files」を選択し、動画をアップロードします。
お好みでサムネイル画像やタグを設定しましょう。
Vimeoの埋め込みコードを取得
アップロードが完了したら、「Share」ボタンを選択しましょう。
メニューを「Sharing」から「Embed」に変更します。
再生できる場所については、お好みで設定すると良いでしょう。
Vimeoでは、特定のドメイン内でのみ動画を再生することも可能です。
設定が完了したら、「Copy embed code」を選択し、コードをコピーします。
StudioにVimeoのパーツを配置
Vimeoの埋め込みコードがコピーできたら、Studio上にVimeoパーツを配置しましょう。
左パネルを開き、「追加」→「ボックス」→「Embed」→「Vimeo」を選択し、編集画面上にドラッグ&ドロップします。
動画の埋め込みコードを追加
Vimeoパーツが配置できたら、先程取得した動画の埋め込みコードをiframeにペーストしましょう。
正しくコードを追加できた場合には、動画のサムネイルが表示されます。
frameの大きさなどはお好みで調整すると良いでしょう。
Studioで動画を埋め込むならどっちがいいのか?
無料で動画を埋め込みたいならYoutubeがおすすめ
Youtubeは、無料で動画を埋め込みたい方におすすめです。
また、Youtube動画の公開設定には、限定公開という選択肢もあるため、URLを知っている人だけに動画を公開することも可能です。
しかし、限定公開はURLを知ってさえいれば、動画を閲覧できるというデメリットがあります。
これらのことを踏まえると、無料で誰でも閲覧できる動画を埋め込みたい方には、Youtubeがおすすめです。
特定の人にだけ動画を表示したいならVimeoがおすすめ
Vimeoは、特定の人にだけ動画を表示したい方におすすめです。
Vimeoでは、動画のプライバシー設定を行うことができるため、特定のサイト内でのみ動画再生を可能にするなど柔軟に動画閲覧権限を設定することが可能です。
これらのことを踏まえると、特定の人や特定のサイト内でのみ閲覧可能な動画を埋め込みたい方には、Vimeoがおすすめです。
まとめ
この記事では、Studioで動画を埋め込む方法について解説しました。
YoutubeとVimeo、それぞれの特徴をもとに使い分けることが大切です。