目次
- 1. 表示動画の変更
- 1.1. 入れ替える動画URLの用意
- 1.2. 動画の入れ替え
表示動画の変更
入れ替える動画URLの用意
(1)Youtubeの表示したい動画ページを表示します。
(2)動画ページの共有をクリックします。
(3)表示されたモーダルの「埋め込む」をクリックします。
(4)画像赤線枠内の「<iframe」から始まる文字列をコピーして、メモ帳等に貼り付けて下さい。>
(5)「src="」から「"」までのURL部分をコピーして、メモ帳に別途貼り付けて下さい。 ※コピーする箇所がわかりやすいように、文字色を赤色にしました。
<iframe width="560" height="315" src="https://www.youtube.com/embed/fzw-Mb-wPS4" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
(4)でコピーした内容はもう使いませんので、上書きしてしまっても大丈夫です。
※動画ごとにこの値は変わります。
※動画ごとにこの値は変わります。
動画の入れ替え
(1)管理ページ[エクステンション] - [モジュール] - [トップ-ストリームシリーズについて]から 編集ページを開きます。
(2)「[Toggle Editor]」をクリックすると、下記のようなコードが表示されます。 ※編集の際、表示されたコードをコピーして別途保存しておきますと、何かあった際にすぐに元の状態に戻せます。
<div class="col-sm-6 col-md-6">
<div class="row">
<h2>ストリームシリーズについて</h2>
<div class="row">
<div class="col-sm-12 col-md-12">
<h6>
<a href="/product/product-search/article/26-26-bs-2">
<img src="/templates/taiyo-template/images/taiyo/top_stream_bnr_md_x2.jpg" alt="" class="img-responsive hidden-xs hidden-sm" />
<img src="/templates/taiyo-template/images/taiyo/top_stream_bnr_xs_x2.jpg" alt="" class="img-responsive visible-xs-block visible-sm-block" />
</a>
</h6>
<iframe src="https://www.youtube.com/embed/fzw-Mb-wPS4" frameborder="0" allowfullscreen class="top-movie"></iframe>
</div>
</div>
</div>
</div>
(3)「src="」から「"」の箇所に、用意したURLを貼り付けます。 ※変更する箇所がわかりやすいように、文字色を赤にしました。
<div class="col-sm-6 col-md-6">
<div class="row">
<h2>ストリームシリーズについて</h2>
<div class="row">
<div class="col-sm-12 col-md-12">
<h6>
<a href="/product/product-search/article/26-26-bs-2">
<img src="/templates/taiyo-template/images/taiyo/top_stream_bnr_md_x2.jpg" alt="" class="img-responsive hidden-xs hidden-sm" />
<img src="/templates/taiyo-template/images/taiyo/top_stream_bnr_xs_x2.jpg" alt="" class="img-responsive visible-xs-block visible-sm-block" />
</a>
</h6>
<iframe src="https://www.youtube.com/embed/fzw-Mb-wPS4" frameborder="0" allowfullscreen class="top-movie"></iframe>
</div>
</div>
</div>
</div>
(4)「[Toggle Editor]」をクリックしていつもの表示に戻します。
(5)保存ボタンをクリックして、ページを確認してください。