SIRIUS(シリウス)YouTube動画を埋め込んでスマホに最適化させる方法

スポンサードリンク

シリウスのサイトに「YouTubeの動画」を表示させる方法と、スマートフォン用に動画サイズを最適化させる方法について解説している動画です。

レビュー★★★☆☆

《ここがオススメ》

スマートフォンでサイトを閲覧したときに動画サイズが大きすぎて見切れてしまわないようにするにはどうすればよいかを詳しく解説しているところがオススメ!

《この動画の要約》

【YouTube動画の挿入方法】

①YouTubeの動画を開き、動画上で右クリックして「埋め込みコードをコピー」をクリック
 ↓
②シリウスの管理画面で動画を表示させたい部分に貼り付ける

・「width」を620「height」349にするとメインコンテンツに合う幅になる

・専用のタグで埋め込みコードを囲むことで、スマホでの表示に最適化させることができる
 →「文字装飾呼び出しボタン」に登録しておくと便利

・ソースを貼り付けることでタグを機能させてスマホ表示を最適化させる

・コメントタグで「何のためのソースなのかわかるようにする」という意味がある
 →自分で分かりやすいように

【ソースの貼り付け方法】

①管理画面から「テンプレート」「iPhoneサイトスタイルシート編集」をクリック
 ↓
②コピーしたソースを貼り付けて「保存」または「全て保存」をクリック

・管理画面の「プレビュー」で右クリックをすると、「携帯サイト」「iPhoneサイト」での表示をプレビューで確認することができる

《一言》

今回の動画で紹介されている操作は、何かとちんぷんかんぷんな人もいらっしゃるかもしれませんが、スマートフォンでもきちんと動画を表示させるためには必要な操作であることを理解しましょう。

何かしらの理由でサイトのYouTubeの動画を表示させたい場面は何度も出てくるかと思います。

その表示、パソコン上では問題ないのですが、自動的にスマートフォンの横幅に合わせることはできず、何も対処しないと見切れてしまって見えにくいです。

別の記事でも解説していますが、最近はパソコンだけじゃなくスマートフォンからのサイトアクセスが増えているため、スマホユーザーにも配慮しサイト構築が必要になります。

そのために「スマホで見ている人には、こっちの設定で表示してね」という指示を出させるのが、今回の動画での操作になります。

初心者は、とりあえず動画の通りに操作を進めていきましょう。

パソコンでもスマホの表示の際のプレビューを確認することができますので、今回の操作に限ったことではありませんが、初めて実行した操作についてはその都度きちんとプレビューで確認することを意識しましょう。

スポンサードリンク

コメントは受け付けていません。

サブコンテンツ

このページの先頭へ