【YouTube】動画をブログの投稿記事に簡単に貼り付ける方法（Blogger）

こんにちは、SAKURAです🌸

YouTuberのハシクレですから、どうしても自分のUPした動画をPRしたい訳です。試行錯誤の上、ある程度納得できる配置がなりましたので、その方法をお知らせします。

配置場所ですが二通り考えられます。投稿記事に埋め込む方法とサイドバーに埋め込む方法です。

投稿記事にYouTubeの動画を挿入する


一つ目は、誰でもできる簡単な方法です。
ツールバーの「動画を挿入」を選んぶ。
  1. 「動画を追加画面」ウインドウが開くので、「YouTubeマイ動画」タブを押す。
  2. 目的の動画を一覧から選んでクリックし、「選択」ボタンを押す。
これだけで完成です。動画にしたら、数十秒で終わっちゃった。(^_^;)

埋め込みコードを取得してYouTube動画を埋め込む



埋め込みの基本的な流れは以下のとおりです。
  1. 埋め込みたいYouTube動画のメージを開きます。
  2. 「共有」ボタンを押す。
  3. 「共有」ウインドウの「埋め込み」ボタンを押す。
  4. スクロールして「埋め込みオプション」の「動画が終わったら関連動画を表示する」のチェックを外す。
  5. 「プライバシー強化モードを有効にする」にチェックを入れる。
  6. 「コピー」ボタンを押す。
  7. ブログの記事の作成画面にもどり、HTMLモードにする。
  8. 挿入したい箇所にカーソルを持っていき、貼り付ける。（シュートカットキー、Ctrl+VでもOK）
  9. 作成モードに戻す。　　
いろいろカスタマイズもできます。ノーマル設定では、動画終了後に関連動画が表示されますが、他人の動画も表示されます。せっかくのお客さんを取られてしまいます。ですので、オプションの「動画が終わったら関連動画を表示する」を無効にします。

５.で「プライバシー強化モードを有効にする」にチェックを入れる。にしていますが、別に入れなくてもいいようです。再生するまでに、Cookieを保存させるか、させないからしいです。ただ、このブログの場合、プライバシーポリシーを掲載してる関係で、一応入れた設定にしています。YouTubeのことは書いてないですからね。

その他の設定として、埋め込みコードを修正したり、追加したりすることでカスタマイズできます。

参考にさせていただいたブログ
ちもろぐ
Youtubeの埋め込みを使いこなす、20個のテクニックまとめ
http://chimolog.co/2017/06/blog-youtube-embed-20.html

以下、単なるコピペです。
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/1V2ceMka7UY?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

動画の大きさを変えるには？

width="560" height="315"の部分です。
この数字を変更します。width="横" height="縦"　です。アスペクト比16：９が多いので、この比率にしたほうがいいのですが、計算するか、表示して調整するかです。

計算が面倒な場合は、width="100%"（表示できる画面の100%という意味、画面の8割にしたければ80％）とすると自動調整されます。ただし、横のみです。縦にするととんでもなく長くなります。



今はサムネイルなので画面にいい感じで収まっているように見えますが、PCで再生させてみると両サイドに黒いスペースができています。これは高さが足らないからです。
スマホ（縦）の場合は、逆に上下に黒いスペースができます。
彼方を立てれば此方が立たず。PCとスマホどちらを優先させるかにもよりますが、どこかで妥協しなければなりません。（両方立たせる方法を次回説明します）

それ以外のカスタマイズですが、私が好んで使いうが、翻訳を表示させるです。
cc_load_policy=1
を入れます。上の動画も入れています。日本語とか英語とか言語を指定することもできますが、それはしていません。できるだけ英語の字幕も入れたいと思っています。

入れる位置ですが、

<iframe width="100%" height="315" src="https://www.youtube-nocookie.com/embed/TZw_dHytM5s?cc_load_policy=1&rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

？ と rel の間ですね。そして＆をrelの前に追加する。
もともと、？rel（関連動画非表示）を付けてましたので、間に入れて＆を追加しましたが、これは複数のパラメータを設定する場合です。1個めが？、2個目以降は＆を頭につけます。

これら以外にも自動再生をさせようと思ったのですが、YouTubeの数字にはカウントされず、さらに、音が突然出るとビックリしてしまいます。音量を制御する方法もありますが、スマホでは無効とのこと。無音の動画ならしてもいいかなという程度です。

いろいろとパラメーターを追加することになりますが、私のような初心者の方は作成モードとHTMLモードの切り替えを1回で済ますように、最初から全部追加したほうがいいと思います。一つ一つ確認しながら、追加するのも手ですが、Bloggerさんがお利口だから、コードを書き換えてしまうんです。すると、次のパラメーターをどこに入れてよいのか迷ってしまいます。

更にいろいろとカスタマイズできますので、興味のある人はリンクのページを参考にされてはと思います。

今回説明したの二つの方法ですが、時と場合のより使い分けるといいと思います。
小さい動画は見にくいですよね。人によっては、YouTubeの動画メージまで来てくれるかもしれません。動画投稿しました程度なら、このほうが良いかもしれません。

今回のように補助的に動画を使う場合はブログにとどまってほしいので、できるだけ大きくしたほうがいいと思います。場合によっては、コントロールメニューを表示させないパラメーターを追加するとか……

あくまでも想像の範囲です。検証はこれからです。（検証ができるほど見てくれる人いませんが……）

ちょっと長くなりましたので、続きは次回にしますね。お楽しみに。

(*^▽^*)

コメント

コメントを投稿

このブログの人気の投稿

【YouTube】ゲーム動画を配信するためのソフト（現在使用しているソフト）

こんにちは、SAKURAです🌸 ゲーム解説ということで、録画ソフトはWindows10付属のゲームバー。設定にあるやつです。MP4ファイルで記憶されます。トリミング（動画の長さの調整）だけなら、これも付属のXboxアプリでできます。 動画編集ソフトPowerDirector１６ それだけじゃ物足りないと、動画編集ソフトPowerDirector１６を買いました。最初はお試し版をダウンロードして使いました。1本目の動画はお試し版でUPしています。初心者でもなんとかできたので、ちょうど特典があるということで、買ってしまいました。 もう一つ欲しいものがあって、音声合成ソフト。声出しが嫌なんで。 よくあるゆっくりボイスやボイスロイドなど。キャラクターは特にこだわりもないので、棒読みちゃんと CeVIO Creative Studio６（お試し版）を使っています。 棒読みちゃんはゆっくりボイスということで声質が無難。みんなが聞きなれているし、ゆっくりで検索する人もいると思います。 他にもゆっくりボイスがありますが、ダウンロードしたら、ノートンがウイルスが含まれているとして削除しました。 ネットで検索すると、ウイルス対策ソフトを止めなさいとありましたが、それじゃそもそも、ウイルス対策ソフトにお金を出す必要もないわけで、入ってるIntelでも脆弱性があるわけで、まあ今回はノートンを信用したわけです。漁ったのは音声合成ソフトだけじゃなかったですから、○○ソフトはいいけど△△ソフトはだめとか私には判断つきませんので。   CeVIO Creative Studio６（お試し版）の方は、使い勝手はなかなか良かったです。セリフも一括入力でしますし、字幕ファイル（SRTファイル）での出力もできます。 少し字幕とセリフについてお話ししときます。 まず、棒読みちゃんでする場合ですが、 PowerDirectorの字幕機能で、セリフを打ち込んで字幕ファイルを出力します。これは字幕の開始時間と終了時間とセリフの書かれたテキストファイルです。 メモ帳で開いてすぐ保存します。次にワードパッドで開きます。メモ帳でいったん開くのは、 直接ワードパッドで開くと文字化けするからです。 ワードパッドで開いた字幕ファイルのセリフを行単位で選択、コピーし棒...
続きを読む

【Blogger】任意の投稿をTOPに固定する方法

イメージ
こんにちは、SAKURAです🌸 まだブログ始めて一ヶ月ちょいですが……。 レイアウトの注目の投稿の設定で、任意の投稿を固定できるみたい。知らなかった。 注目の投稿の設定は以前からあることは知っていましたが、おすすめと、最新記事だけだと思っていました。注目の投稿の選択ってありましたっけ？　検索できたのかなあ？　 固定したいと思って、だいぶググってみたんですけど、初めて気が付きました。 もしかして、テーマをシンプルにしていたせいなのかな？ちなみに今は Emporio です。 周知の事実でしたら、ごめんなさい。 ちょっと前に、ページ機能を使ってホームページみたいな仕様にしたんですけど、入り口を作るのに悩んでました。これなら、Minecraft関連の記事に来てもらいやすくなります。たぶん。 一時的なお知らせなんかにも使えますよね。来月イベントしますから来てくださいとか。 普通の記事だと、投稿する度に下がっちゃいますから。イベントが終われば解除すればいいので。 いろいろ使える機能後思います。 追記、 この1,2ヶ月で、新たな機能が加わったと見るべきか。それとも、もしかしてこれかな？ Blogger Draft を使用する 設定のユーザー設定の『Blogger Draft を使用する』をはいにする。 Blogger Draftとは、Bater版みたいな、Windows10でいう、insider Preview みたいなものでしょうか。 クリボウさんのブログの方に書いてありました。 ” この Blogger in draft では、Blogger に正式採用される前の機能を、自分の Blogger ブログで試すことができます。新機能が部分的に「Blogger」に採用されていく「Blogger beta」と考えれば分かりやすいかもしれません（余計混乱する人は気にしないで下さい）。正式採用前の機能を試せるから、「in draft」と呼ぶようです。投稿した記事が全部下書きになるとか、ブログ初心者のためにお試しブログを提供するとかではないんですね。” クリボウのBlogger Tips『Blogger in draft』より引用 http://www.kuribo.info...
続きを読む

アナリティクス 知らず知らずのうちに規約違反をしていました

今回も、ブログ再点検の話題です。 Google アナリティクスの記事を目にしました。 人生フリースタイル Googleアナリティクス利用。あなたも規約違反していませんか！？ http://freestyle-lives.com/archives/193 内容を簡単に紹介すると、アナリティクスに関するプライバシーポリシーを設置する方法です。プライバシーポリシー設置の経緯を読んだとき、身に覚えがある事が書かれていました。 アナリティクスの画面を、キャプチャーすることは規約違反？ Google アナリティクス利用規約 https://www.google.com/analytics/terms/jp.html 皆さんはすでに熟知していらっしゃると思いますが、私はトラッキングIDを取得する最初だけしかみていなくて、何が書いてあったかよく覚えていませんでした。 改めて読むと、４、排他的ライセンスの項目に、次のように禁止事項が書いてあります。 ”お客様は次の行為を行わず、また第三者に次の行為を許可しないものとします。（i）本ソフトウェアまたは付属文書の複製、改変、改作、翻訳。派生物の作成を行うその他の行為。”Googleアナリティクス利用規約から引用 更に、５、機密保持の項目に、相手の同意なくして公開してはいけませんと書いてあります。相手とは、私から見るとGoogleのことです。（Googleから見ると私） 規約や規則は白黒はっきりせず、グレードの領域が多く存在します。 ４、の禁止事項ですが、これは著作権に関連した禁止項目だと思えます。ソフトのプログラムを複製、改変、改作してはいけませんよという意味にではないでしょうか。 「派生物」これがよくわからないです。著作権の関係では、派生著作物（derivative works）となりますので、改作、翻訳を含めた他のソフトウェアや文書を作ることは禁止です、ということになろうかと思います。 キャプチャーすることは、デザインのコピーと考えられるので、禁止項目に該当する可能性が高いと思われます。 ５、機密保持ですが、お互いの機密情報を連絡せずに公開しないことです。分かりやすい例は、私の個人情報（ちょっとニュアンスがちがいますが）を理由もなく、Googleは公表しない。とい...
続きを読む