パソコン

YouTube動画を埋め込んで編集する時はパラメータが便利です!

投稿日:2017年12月26日 更新日:

YouTube動画の編集にはパラメータが便利です!

YouTube動画の編集にはパラメータが便利です!

前回、YouTubeで公開されている動画を、自分のサイトやブログに掲載したいときの、HTMLソースコードの埋め込み方法や手順と、動画の始まりと終わりの時間を指定するカスタマイズ方法をご紹介しました。

今回は、時間以外のYouTube動画の編集に便利なパラメータの使い方をご紹介します!

スポンサーリンク

YouTube動画を埋め込んで編集する時はパラメータが便利です!

前回ご紹介した内容は、

・動画を指定の位置から再生させる
・動画の再生を指定の位置で停止させる
・指定した区間だけ動画を再生させる

という時間に関するカスタマイズ方法でしたが、今回は、

・動画が終わった後に関連動画を表示させない
・動画を自動再生させる
・動画を繰り返し再生させる
・タイトルバーを表示させない
・YouTubeのロゴを表示させない
・コントロールバーを表示させない

以上、6つのカスタマイズ方法をご紹介します。

パラメータを付加する方法

 
基本的な埋め込みコードは以下のようになっており、動画URLの後ろに「?」を付けた後に、必要に応じたパラメータを付加して、自サイトに埋め込んだ動画の再生方法を変更していきます。
 

<iframe width=”560″ height=”315″ src=”動画URL?” frameborder=”0″ allowfullscreen>

 
パラメータを複数追加する時は、「パラメータ&パラメータ」のように、&でパラメータ同士を繋げてください。
 

編集前の動画です

 

<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/xlHiV05IzEU” frameborder=”0″ allowfullscreen>

 


 
 

動画が終わった後に関連動画を表示させない「rel=0」

通常、YouTube動画が終わった後は、他の関連動画が表示される仕組みになっています。せっかくホームページやブログを訪問してくれたユーザーに離脱してほしくない場合などに使える、関連動画を表示させないパラメータです。
 

<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/xlHiV05IzEU?rel=0” frameborder=”0″ gesture=”media” allow=”encrypted-media” allowfullscreen>

 


 
 

動画を自動再生させる「autoplay=1」

ページを開くと同時に動画を再生させるパラメータです。
 

<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/xlHiV05IzEU?autoplay=1” frameborder=”0″ gesture=”media” allow=”encrypted-media” allowfullscreen>

 


 
 

動画を繰り返し再生させる「loop=1」

再生ボタンをクリックしてから停止ボタンをクリックするまで動画を繰り返し再生させるパラメータです。
 

スポンサーリンク
<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/xlHiV05IzEU?loop=1&playlist=YouTubeID(xlHiV05IzEU)” frameborder=”0″ gesture=”media” allow=”encrypted-media” allowfullscreen>

 


 
 

タイトルバーを表示させない「showinfo=0」

動画の再生が始まればタイトルバーは消える設定になっていますが、再生後もカーソルを動画に合わせればタイトルバーは表示されます。タイトルバーをクリックするとYouTube動画ページへリンクする仕組みになっているため、サイト訪問者がページから離脱してしまうことを防ぐために、タイトルバーを非表示にさせるパラメータです。
 

<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/xlHiV05IzEU?showinfo=0” frameborder=”0″ gesture=”media” allow=”encrypted-media” allowfullscreen>

 


 
 

YouTubeのロゴを表示させない「modestbranding=1」

タイトルバーと同様に、YouTubeプレイヤーの右下に表示されているYouTubeのロゴをクリックをすると、YouTube動画ページへリンクする仕組みになっているため、YouTubeのロゴを非表示にさせるパラメータを付加することで、サイト訪問者がページから離脱してしまうことを少しでも防げるかもしれません。
 

<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/xlHiV05IzEU?modestbranding=1” frameborder=”0″ gesture=”media” allow=”encrypted-media” allowfullscreen>

 


 
 

コントロールバーを表示させない「controls=0」

YouTubeのロゴだけではなく、コントロールバーごと非表示にさせるパラメータです。YouTube動画というイメージが薄れてオリジナル動画だと思ってもらえる可能性があります。
 

<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/xlHiV05IzEU?controls=0” frameborder=”0″ gesture=”media” allow=”encrypted-media” allowfullscreen>

 

さいごに

サイトにYouTube動画を埋め込む際に、動画URLの後ろに「?」+「パラメータ」を付け加えるだけで、簡単に動画の再生方法を変更することができますし、オリジナル動画っぽさも演出?できるので、是非、一度、試してみて下さいね♪
 
 
【関連記事】

スポンサーリンク

-パソコン
-, ,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

コピー&ペーストが連続でできるクリップNOTEの使い方

コピーと貼り付けが連続でできる超便利なクリップNOTEの使い方

コピー&ペーストが連続でできるクリップNOTEの使い方 スポンサーリンク コピー&ペーストを何度も繰り返しすのは面倒!連続でコピーした文字を、連続で貼り付けられたら便利だなぁと思いませんか? コピーと …

スマホ画面でのサイトの表示をPCで確認する方法をご紹介!

スマホでのサイトの画面表示をPCで確認する方法をご紹介!

    チビッ子からお年寄りまで、スマホの所有率が79.4%となった現代、自分が運営しているサイトが、携帯やスマホから見るとどのように表示されるかを把握しておくことはとても重要なこ …

スマホ画面をPCに表示させてキャプチャーする方法をご紹介!

スマホ画面をPCに表示させてキャプチャーする方法をご紹介!

    前回、スマホでのサイトの画面表示をPCで確認する方法をご紹介!という記事で、自分が運営しているサイトがスマホではどのように表示されているかを、パソコンのGoogle Chr …

Amazonアカウント乗っ取りの手口と被害状況

Amazonアカウント乗っ取りの手口と被害状況と防止対策とは?

Amazonアカウント乗っ取りの手口と被害状況 スポンサーリンク 先日、自分のAmazonアカウントにログインできなくなったため、Amazonに相談し、アカウントを解約しました。 私の出品者アカウント …

単語の登録に失敗しました

単語の登録に失敗しましたと表示された場合の修復方法は?

Windows7のIMEの辞書ツールは、文字入力の手間と時間が省けてとても助かりますね♪いつものように単語/用例の登録をクリックして、頻繁に使う単語を登録しようとしたところ「単語の登録に失敗しました」というメッセージが出てしまい登録ができませんでした。面倒臭がり屋の私はしばらく放置していましたが、やはりとっても不便なので修復してみることにしました。あっけにとられるほど簡単なのでお試しください!