こんにちは!ブリコラブログ!です。
今回は人気ブログテーマのひとつ『Affinger5(アフィンガー5)』で
作成記事にYouTube動画を貼り付ける方法を徹底解説します!
こちらの記事をご覧いただくと、以下 ↓↓ のような貼り付けが可能となります!
引用元)『劇場版「鬼滅の刃」無限列車編』公開中PV
また、当ブログでは有料テーマ「Affinger5(アフィンガー5)」を使用しています。
このテーマに搭載されているYouTube動画の貼り付け方法、プラグインなどをせずとも
貼り付けれる方法を両方お伝えしますね。
それでは、早速一緒にやり方を学んでいきましょう!
『記事上でYouTube動画を再生する』か『リンク先で再生するか』を決めましょう!
・あなたの好みやブログ読者目線に立って、
“どのように再生させたいか?”をまず決めてください!
記事内で動画視聴が完結し他のページへ移動してもらうのは申し訳ない・・・
ということでしたら記事上での動画再生を という具合ですね。
SEO対策にも!
記事上でYouTube動画を再生すると、
基本的には読者が動画を観終わるまでページへ滞在することになりますね。
滞在時間が長くなると、セッション時間が長くなるということにつながります!
記事の魅力化・集客には、動きのある動画プロモーションも欠かせないツール
ではないでしょうか??
動画貼り付けの意図/目的を明確にしてスタートです!
『ブログ記事上でYouTube動画を再生する』貼り付け方法
❶YouTube動画の「共有」からURLをコピーして貼り付ける!
・貼り付けたい動画の右下にあるボタン「共有」をクリックしてください!
・次に出てきた画面に表示されているURLをコピーします!
・コピーしたURLを、あなたの記事で貼り付けたい箇所へカーソルを合わせ
ペースト(Ctrl+V)します!ペーストは、「ビジュアル」画面で操作してください!
すると、以下のような形式 ↓↓ で記事に埋め込まれた表示になっているはずです!!
一つ目の貼り付け方法、マスターです!簡単ですよね!!
❷YouTube動画 埋め込み用コードで貼り付ける!
・貼り付けたい動画の右下にあるボタン「共有」をクリックしてください!
・次の画面一番左の「埋め込む」をクリックして、コードを表示させましょう。
コードをコピーしたら、記事編集画面を「テキスト」にします。
※「ビジュアル」ではコードの貼り付けができません!!
コードの貼り付けが完了すると、
❶の方法とおなじく あなたのブログ内記事に埋め込まれた状態となります!
※ブログ内の表示は❶と同じ状態なので、ブログ内の見え方を割愛致しますね。
『リンク先でYouTube動画を再生する』貼り付け方法
❸動画リンク先をそのまま貼り付ける!
・貼り付けたい動画のURLをコピーしてください。
・次に、コピーしたURLを「リンクの挿入/編集(Ctrl+K)」を押して
リンク挿入欄にペースト(Ctrl+V)します。
すると、以下 ↓↓ のような表示になるはずです!
https://www.youtube.com/watch?v=-ewm56D9DzY%3Ft%3D3
この方法ですと、記事の前後に説明書きがなければ「どこにリンクされてるの??」
と、若干不安や警戒がよぎってしまうかもですね・・・。
回避方法としては、「タグ▼」機能にある「カスタムボタン」との組み合わせを提案します!
カスタムボタン作成時にコピーしたURLを挿入し、以下のようなボタンを設置。
記事の説明と合わせて設定するとアクセントにもなり、効果的に表示できますよね!
❹アフィンガー5(Affinger5)の機能を使ってYouTube動画を貼り付ける!
・貼り付けたい動画の右下にあるボタン「共有」をクリックしてください!
・次の画面に表示されたURLの赤下線部の箇所のみコピーします。
・コピーした状態で「タグ▼」→「その他パーツ」→「YouTube」
の順で進んでください。
・すると以下のようなショートコードが出てきますので、
id=のうしろにコピーした文字をペースト(Ctrl+V)してください!
・完了しますと、以下のような形式で記事に埋め込みが完了となります。
『カスタマイズ』方法
❺YouTube動画の再生開始時間を指定する!
・ブログ読者の方に、「このシーンから動画を観てもらいたい!」という
作者のニーズとサービス精神を満たす機能です!
設定方法はカンタンですので、ぜひ合わせてマスターしてみてください。
- 例えば、『炎』のサビから聞いてもらいたい!という場合
・まずサビがどこから開始するのか?を動画で確認します!(地味作業・・・)
※数字が小さくてスミマセン・・・『1:15』からがサビと分かりました!
・その状態で、右下にあるボタン「共有」をクリックしてください!
すると、先ほどと違って左下の「開始位置」のところに「1:15」と表示されています。
・チェックボックスにチェックを入れてから、「コピー」をクリックします。
・コピーしたURLをあなたの記事で貼り付けたい箇所にカーソルを合わせ
ペースト(Ctrl+V)します!ペーストするときは「ビジュアル」画面です!
すると・・・LiSAさんが今まさにサビを熱唱するところから動画が再生されます!!
アフィンガー5(Affinger5)YouTube動画貼り付け・まとめ
- ブログ記事にYouTube動画を貼り付ける方法は、「4つ」
- 『ブログ記事上で動画を再生する』または、『リンク先で動画を再生する』で貼り付け方が異なる!
- ブログ読者に“動画をこのシーンから見てもらいたい!”というカスタマイズも可能!
いかがでしたでしょうか??
+α のアクセントであなたの記事の魅力が2倍にも3倍にもなる
YouTube動画の組み込み!ぜひチャレンジしてみてください。
私の記事で自作YouTube動画を組み込んだ記事がございます!
参考にご覧ください。
また、記事内の文字やアイコンの装飾による魅力化についての記事も
よろしければどうぞ!
最後までご覧いただきありがとうございました!
次回のブリコラ!にもどうぞご期待ください!