【 みんカラ 】ブログにYouTube動画を貼り付ける方法 2015年度版 Part１

ご無沙汰しております。
貧乏すぎて餓死しそうですがまだ生きています。（笑）
１０年前に買ったWindows XPのマイPCが動作が重たくなるのが嫌でセキュリティソフトを入れずに使い続けていましたが、先々月ウィルス感染してしまい、止むを得ずWindows 8.1 Update 64bitを導入。益々貧乏になりました。（笑）
この１ヵ月「Microsoftアカウント」「チャーム」「リボン」「タイル」「ピン留め」「ストアアプリ」何じゃそれ？って感じで格闘しておりました。多少慣れてきたところで、またWindows 10と格闘する予定です。（笑）

軍資金不足で走りネタもなく、ブログ更新もしていなかったですが、生存報告も兼ねてﾜﾀｸｼのみんカラブログでのPVレポートで一番人気のある？ネタでもしようかと思います。


Flash Player はウェブサイトの動画プレーヤーや広告など、無数のウェブサイトで利用されていますが、何かと脆弱性が問題視されていますね。
Mozillaは7月13日、Firefoxのアップデートにより、初期設定ですべてのバージョンのFlash Playerをブロックしたと発表。Facebookのセキュリティ責任者にも「AdobeはFlash終了を宣言すべき」と言われる始末。
YouTubeもFlashからHTML5に移行するなどの動きがあり、<object>タグによるFlash形式の動画プレーヤー埋め込みも非推奨として、今年から<object>タグによる以前の埋め込みコードの公開をやめてしまいました。
【 みんカラ 】ブログでは、<object ～></object>や、<iframe ～></iframe>や<script ～></script>などのHTMLタグは、強制的に無効になる設定になっており、HTML表記が文字列として表示されるだけでしたが、<embed>タグを使えば、従来ではYouTube以外の動画でも貼り付けられたのですが何時の間にかYouTube動画以外は<embed>タグも無効化されるようになってしまったようです。


そこで改めて、【 みんカラ 】ブログに動画を貼り付ける方法 の2015年度版を解説したいと思います。

まず、【 みんカラ 】ブログに動画を貼り付けるためには、張り付けたいYouTube動画のURLを入手しなくてはいけません。 ＵＲＬって何？と思われる方もいらっしゃるかも知れませんが、要するにインターネット上にある情報の場所（住所のようなもの）で、具体的には、「http://～」とか「https://～」となっているアドレスのことです。

１．まずは、貼り付けようとするその動画のYouTube単独ページにアクセスします。
（ブログやホームページに貼り付けられた動画からYouTube単独ページにアクセスするには、動画の上部にあるタイトルのリンクをクリックするか、動画の下部にあるYouTubeのロゴマークをクリックします）
動画の下にある [ 共有 ] と表示されたボタンをクリックします。すると、その下に[ 共有 ] と表示されるボタンの下のフォームボックス内に“https://youtu.be/***********”という内容のＵＲＬ（アドレス）が出力されますので、そのＵＲＬをコピー（右クリックして「コピー」を選択）します。

もう一つYouTube動画のURLを入手する方法としては、貼り付けようとする動画上で右クリックして、「動画の URL をコピー」「Copy video URL」もしくは、「動画の URL を取得」「Get video URL」を選択してもよいです。

２．次にブログの編集ページ本文中の動画を貼り付けたい所（行）でクリックします。

３．続いて、編集画面上の「動画」ボタンをクリックすると表示されるダイアログ（Explorer ユーザープロンプト）のフォームボックス内で右クリックし、「貼り付け」を選択し、ＯＫボタンをクリックします。

４．すると編集中の本文に という埋め込みコードが自動生成されます。
確認画面でチェックすると、実際には↓こんな感じで貼り付けられていると思います。


一応、これで動画の貼り付けが出来ているはずですが、このみんカラの動画投稿ボタンによる投稿方法では、今のところ動画埋め込みサイズが幅425 × 高さ355ﾋﾟｸｾﾙ の４対３のアスペクト比にしかなりませんので、アスペクト比１６対９の動画を貼り付けた場合、動画の上下に黒帯が生じされ、尚且つ動画下部にあるコントロールバーの右に全画面表示ボタンがあるにも関わらず、ボタンをクリックしても全画面表示出来ません。
そこで、もう一手間かけて視聴者に優しい貼り付け方法を紹介したいと思います。

【 みんカラ 】ブログ記事の幅は580ﾋﾟｸｾﾙにデザインされていますので、これに合わせて動画の埋め込みサイズやアスペクト比を変えることもできます。
変更する所は上記の埋め込みコードの内の width='425' height='355'の数字部分です。
例えばアスペクト比１６対９の動画を貼り付けたい場合には、数字の部分を半角英数字で width='580' height='326'に、アスペクト比４対３の動画を貼り付けたい場合は、 width='580' height='435'に変更すると記事スペース幅に合わせたサイズで貼り付けられます。

現在のYouTube埋め込みプレイヤーでは埋め込みサイズの幅と高さの比が１６対９もしくは４対３になると、コントロールバーが自動的に隠れる設定になっています。


YouTbe動画プレイヤーには動画下部のコントロールバー右にある全画面表示ボタンをクリックするとフルスクリーンサイズで表示する機能がありますが、上記のままではボタンをクリックしても何も変わりません。
フルスクリーンサイズ表示可能にするには、wmode='transparent'というコード部分を半角英数字でallowfullscreen='true'に変更、またはコードを追加すると全画面表示可能になります。
（左下の動画のコントロールバー右にある全画面表示ボタンをクリックしてみてください。）

逆に、ビデオ ＩＤの後ろに&fs=0というコードを追加することで、全画面表示ボタンをコントロールバーに表示させないことも可能です。（右下の動画）



いちいち文字入力するのが面倒くさいという人は、予め「メモ帳」などのソフトで といった雛形コードを作成・保存しておいて、ブログ編集本文中の動画を貼り付けたい所に直接 雛形コードをコピー＆ペーストし、その後 動画のビデオ ＩＤにあたる***********部分だけ換えるという方法もあります。この方法であればリッチ編集画面に於いても動画を貼り付ける事ができます。


この様に、YouTubeの動画埋め込みプレイヤーにはオプションのパラメータを YouTube 動画 SWF URL の末尾に追加することで、外観をカスタマイズしたり、動画を自動再生や繰り返し再生させたり、動画の再生開始位置や再生終了位置を指定したり、再生画質を指定する等といった裏技的な機能もあります。





次回のブログではYouTubeの動画を貼り付ける際の裏技的なカスタマイズ方法（パラメータオプション）を紹介します。