仲介UPのサイドバーにYoutube動画を埋め込む方法

いつも仲介UPのご利用、誠にありがとうございます。

今回は第3カラム（サイドバー）に小さく動画を表示する方法をお伝えします。

後半少し難しいところがあるかもしれませんが画像を使って解説します。

YouTubeの埋め込みコードをコピーする

まず表示させたいYouTubeのページを開きます。

動画の下にある「共有」をクリックします。

埋め込みコードを表示する

「共有」項目から「埋め込む」ボタンをクリックします。

クリックすると「Embed Video」ダイアログが現れ、埋め込みコードが表示されます。

そのままのコードだとサイズが大きすぎて第3カラムからはみ出てしまうので幅と高さをオプションで調節します。

すると、ダイアログの表示を下にスクロールするとオプション設定項目が見えてきます。

オプションの設定とサイズの変更

「動画が終わったら関連動画を表示する」のチェックを外しておきます。

オプション設定が済んだら、また上にスクロールし、動画のサイズを変更します。

2か所ある赤い囲みの中の数値を変更します。

幅と高さの調整方法（目安）

動画の比率が16：９のとき

width（幅）：190
height（高さ）：106

動画の比率が4：３のとき

width（幅）：190
height（高さ）：143

埋め込みコードをコピー

以上の設定で生成された埋め込みコードをすべて選択状態にし、ダイアログの右下にある「コピー」をクリックします。

コピーしたコードは、いったんメモ帳などに貼り付けておくか、仲介UP管理画面に貼り付けるまでコピーしたままの状態にしておいてください。

仲介UP管理画面から貼り付ける

仲介UP管理画面の「サイト設定」→「サイト設定」ページの「ページ共通」タブ内の「第3カラム」項目に貼り付けます。

第3カラム項目のエディタ上の「htmlソースを編集」アイコンをクリックします。

HTMLエディタがが立ち上がるのでここでは一番下の行に埋め込みコードを貼り付けます。

左下の更新ボタンをクリックすると、黄色い長方形のブロックが一番下に追加されます。

管理画面右上の「設定を保存する」ボタンをクリックすれば保存完了です。

公開ページを確認する

公開ページを再読み込みすると第3カラムの一番下にYoutube動画が埋め込まれているのが確認できると思います。

まとめ

Youtubeにアップしているプロモーション動画を自社サイトに埋め込みたいというお問い合わせがあるのですが、HTMLエディタを使わないといけないところが少し難易度が高いかもしれないと思い、記事にしてみました。

うまくいかなかったり、順番を並び替えたいがやり方がわからないなど、

ご不明な点などがございましたら、仲介UPスタッフが全力でサポートいたしますのでお気軽にお問い合わせ頂ければ幸いです。

おまけ

簡易PDFマニュアルを作りました。よろしければダウンロードしてお使いください。