ヘルプトピックへのビデオコンテンツの埋め込み

  • リリースバージョン: Xanadu
  • 更新日 2024年08月01日
  • 所要時間:2分
  • カスタム埋め込みヘルプトピックにビデオコンテンツへのリンクを埋め込むことができます。YouTube と Vimeo のビデオコンテンツがサポートされています。

    始める前に

    必要なロール:embedded_help_admin または admin

    このタスクについて

    HTML エディターのビデオの挿入/編集アイコンを使用してビデオを埋め込むことはできません。ソースコードを入力する必要があります。

    図 : 1. HTML エディターのアイコン
    ビデオを埋め込むには、ビデオの挿入アイコンではなく、ソースコードアイコンを使用します。

    アドミニストレーターは、ユーザーが 埋め込みヘルプ のシステムプロパティに埋め込まれたビデオを表示する機能を無効にできます。

    手順

    1. ビデオの埋め込みコードを取得するには、次の手順を実行します。
      1. YouTube または Vimeo でビデオの場所に移動します。
      2. ビデオの [共有] オプションを開きます。
        YouTube では、テキストは動画の下に表示されます。Vimeo で、ビデオの横にある共有アイコンをクリックします。
      3. [埋め込み] でコードを選択し、テキストエディターに貼り付けます。
      4. コードを変更して、 <div> 埋め込みヘルプコンテンツページにレンダリングされない要素を削除します。
        たとえば、YouTube 動画の埋め込みコードは次のとおりです。変更されたコードには、埋め込まれたビデオのタイトルも含まれており、 <p> タグを含む行にあります。
        <iframe width="560" height="315" src="https://www.youtube.com/embed/bqh-5yew2yQ"  frameborder="0" allowfullscreen></iframe>

        変更後のコードは次のようになります。

        <div class="video"><iframe src="https://www.youtube.com/embed/bqh-5yew2yQ"  allowfullscreen=""></iframe>
        <p class="p">Video: Work at Now</p>
        </div>

        Vimeo の埋め込みコードには、より多くの属性があります。次の例のように削除します。YouTube と Vimeo の allowfullscreeen 属性の違いに注目してください。

        <div class="video"><iframe src="https://player.vimeo.com/video/67392563" frameborder="0"  allowfullscreen></iframe>
        <p class="p">Video: Work at Now</p>
        </div>
        注:
        例に示すように、 <iframe> タグと <p> タグを <div class="video"> タグで囲みます。アドミニストレーターがビデオコンテンツを表示するプロパティを無効にすると、 <div class="video"> タグ内のすべてのコンテンツが非表示になります。
    2. 移動先 埋め込みヘルプ > ヘルプコンテンツをクリックし、カスタムヘルプトピックを開いてビデオを埋め込みます。
    3. ソースコードアイコン (<>) をクリックします。
    4. ビデオの場所の上の行の末尾にカーソルを置きます。
    5. Enter キーを押して空白行に移動し、変更した埋め込みコードを入力します。
    6. [ OK] をクリックし、[ 更新] をクリックします。
    7. ビデオが表示されることをテストするには、更新したコンテンツが表示されるページを開き、ヘルプパネルを開きます。