アメブロのサイドバーにYoutube動画を埋め込む方法

僕のブログのアクセス解析(アナリティクス)の検索ワードで、『アメブロ、サイドバーにYoutube』と言う検索が来てるので、その方法に関しても詳しく、スクショを含めながら、解説していきます。

アメブロのサイドバーに、YouTube動画を埋め込む場合、サイドバーのサイズ(カラム数)も解らないといけないので、それについては、別記事を参照してください。

アメブロのサイドバーにYoutube動画を埋め込む方法の手順！

アメブロのサイドバーにYou Tube動画を埋め込む方法は、先にYou Tube上で、埋め込みたい動画のURLを取得。

You Tube上での作業が終わったら、アメブロの管理画面で、サイドバーの編集に移ります。
それでは、更に詳しく解説していきますね！！

YouTubeを開き、埋め込みたい動画ページを開きます。

そして、赤枠で囲ってある、『共有』をクリック。

すると次の画面に切り替わるので、赤枠の『埋め込みコード』をクリックします。

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

上記コードでもOKですが、サイドバーのサイズを手入力しなくてはいけないので、赤枠を『もっと見る』をクリックすると、幅を入力すれば縦サイズは自動に検出してくれます。

(幅の数値が小さすぎると適切なサイズが検出されない場合があります。)

アメブロが、2カラムの場合サイドバーのサイズは、300です。
横幅の部分に、300と入力して、『Enter』を押せば、OK！
縦幅が、225と出るはずです。

アメブロが3カラムの場合、サイドバーのサイズが180です。
横幅の部分に180と入力して、『Enter』を押せば、OK！
縦幅が、135と出るはずです。

数値が出たら、プレビュー画像の上部コード、赤下線の width=”420“と　height=”315“の数字部分をそれぞれ、カラム数に応じて、変更します。

下記の様なコードが出来るはずです。

<iframe width=”300” height=”225” src=”https://www.youtube.com/embed/QIMrw-p2eoo” frameborder=”0″ allowfullscreen></iframe>

このコードをコピーしておきます。

マイページから、右上歯車の隣(右側)のメニューバーをクリック。

赤枠内サイドバーのフリースペース編集をクリックします。

そこに、先ほど、YouTubeで作った、コードを貼り付けて下さい。

コードを貼り付けたら、保存をクリック。

確認したい場合は、プレビューをクリック。
プレビューした場合は、このフリースペース編集画面に戻って、保存を最後に押さないと、反映されないので注意。