お客さまへの大切なお知らせ:膨大なサポート情報を少しでも早くお客さまにお届けするため、本コンテンツの日本語版は人間の翻訳者を介さない自動翻訳で提供されております。正確な最新情報については本コンテンツの英語版をご覧ください。
Landing Pages

HubSpotコンテンツに動画を追加する

更新日時 2021年 3月 27日

対象製品

Marketing Hub  Professional, Enterprise
Service Hub  Professional, Enterprise
CMS Hub  Professional, Enterprise

HubSpot動画を使用すると、ファイルツールに動画をアップロードし、ページ、マーケティングEメール、ブログ記事、ナレッジベース記事に動画を追加できます。

HubSpot動画は、ドラッグ&ドロップ マーケティングEメールページのドラッグ&ドロップエリアの動画モジュールに挿入できます。HubSpot動画は、ページ、ブログ記事、ナレッジベース記事のリッチテキストモジュールでもサポートされています。

HubSpot動画と訪問者のやり取りをカスタマイズするときには、動画再生の前後でCTAまたはフォームを表示できます。

注:HubSpot動画はVidyardを基盤としていますが、Vidyardをご利用のお客様向けに別途提供されている機能「Vidyard for HubSpot連携」とは異なります。ご自身のVidyardアカウントの動画は、HubSpotのファイルツールには表示されません

始める前に

  • この記事では、HubSpotにアップロードされた動画ファイルをHubSpotコンテンツに追加する方法について説明します。URLまたは埋め込みコードから外部動画を追加するには、HubSpotでの外部メディアの埋め込みについて詳細を確認してください。
  • HubSpot動画機能を使用するには、動画を追加する各ユーザーがHubSpot動画を有効にし、Vidyardの利用規約に同意する必要があります。
  • HubSpot上でホスティングできるコンテンツの動画は1アカウントにつき250個までという上限があります。有料のVidyardアカウントを統合する場合、この上限はVidyardサブスクリプションの制限によって決定されます。
    • この上限は、1対1のEメール、テンプレート、またはシーケンスに追加した動画には適用されません。
    • ファイルツール[埋め込み、共有、トラッキングを許可]スイッチがオンになっている動画のみが、最大250件の対象としてカウントされます。
    • コンテンツエディターに新しい動画ファイルをアップロードすると、自動的に[埋め込み、共有、トラッキングを許可]がオンになります。
  • サポートされるファイルタイプはブラウザーごとに異なるため、場合によっては、動画ファイルがブラウザー上で再生されずにダウンロードされます。アップロードされる動画形式が.mp4のファイルはほとんどのブラウザーでサポートされているため、ブラウザー上で再生が行われます。
  • 各動画は、ファイルツールの制約の影響を受ける場合があります。

Eメールの動画モジュールにHubSpot動画を追加する

HubSpot動画は、ドラッグ&ドロップEメールエディターではサポートされていません。ほとんどのEメールクライアントは動画に対応していないため、マーケティングEメールに追加した動画は、動画プレイヤーボタン付きのサムネイル画像として表示されます。このサムネイル画像は、Eメール受信者が動画を再生できるウェブページへのリンクです。

  • HubSpotアカウントにて、[マーケティング] > [Eメール]の順に進みます。
  • Eメールの名前をクリックします。
  • サイドバーエディターで動画モジュールをクリックし、Eメールにドラッグします。
  • [動画タイプ]セクションで、[HubSpot動画]を選択します。

add-hubspot-video-to-email-1

    • ファイルツールから動画を選択するには、[動画を参照]をクリックし、既存の動画のサムネイル画像を選択します。
    • 新しい動画をアップロードするには、[アップロード]をクリックし、コンピューター上のファイルを選択します。次に、動画のサムネイル画像をクリックします。
  • 動画のサイズを変更するには、または高さを入力します。
  • 動画の情報をカスタマイズするには、[動画の詳細]セクションで、[編集]をクリックします。

注:動画の詳細に対する変更は、動画がHubSpotのコンテンツツールで使用されるすべての場所に適用されます。


    • 右側のパネルで、[サムネイル画像を変更]をクリックして動画のプレビュー画像を変更します。
    • スライダーをクリックして動画の特定のポイントにドラッグするか、または[カスタム画像をアップロード]をクリックして、コンピューターから新しい画像を追加します。サムネイル画像の下の[完了]をクリックします。
    • ファイル名タイトル説明入力しますこれにより、検索エンジンによって動画の内容が認識されるようになります。
    • [完了]をクリックします。

edit-your-video-details

  • 動画の再生ボタンの表示を編集するには、[スタイルオプション]をクリックします。
    • 再生ボタンの色をカスタマイズするには、16進値を入力するか、カラーピッカーをクリックしてを選択します。
    • 再生ボタンのサイズをカスタマイズするには、ピクセル値を入力するか、スライダーをクリックして特定の位置にドラッグします。再生ボタンの公開プレビューが更新されるまでには数秒かかる場合があります。
email-video-module-style-options
  • モバイルデバイスの全幅で動画を表示するには、[モバイルデバイスで最大幅として表示]チェックボックスを選択します。動画が元の寸法よりも大きい幅で表示されることはありません。
  • 動画を右または左側に移動するには、[位置合わせ]ドロップダウンメニューをクリックし、[左]、[中央]、または[右]を選択します。
  • 動画のサイドにスペースを追加するには、[パディング]スイッチをクリックしてオンに切り替えます。
    • 動画のすべてのサイドに同じパディングを適用するには、[すべてのサイドに適用]チェックボックスをオンにします。
    • [上]、[下]、[左]、または[右]の各テキストフィールドにパディングのピクセルを入力します。

add-padding-to-video-module

ページの動画モジュールにHubSpot動画を追加する

HubSpot動画は、ウェブサイトまたはランディングページのドラッグ&ドロップエリアに追加された動画モジュールでサポートされています。Starterテンプレートを使用して作成したランディングページではHubSpot動画がサポートされませんが、代わりに外部動画を埋め込むことは可能です。

  • HubSpotアカウントで、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]または[ランディングページ]の順に進みます。
  • ページにポインターを合わせ、[編集]をクリックします。
  • サイドバーエディターで動画モジュールをクリックし、ページにドラッグします。

add-video-to-a-page-1

  • コンテンツエディターで、動画モジュールをクリックします。
  • サイドバーエディターの[動画タイプ]で、[HubSpot動画]を選択します。
  • ページに追加する動画を選択します。
    • ファイルツールから動画を選択するには、[動画を参照]をクリックし、既存の動画のサムネイル画像を選択します。
    • 新しい動画をアップロードするには、[アップロード]をクリックし、コンピューター上のファイルを選択します。 
  • 動画の最大サイズを選択します。 
    • 本来のサイズ:動画が本来のサイズを超えて表示されることはありません。
    • 全幅:動画は視聴に使われるデバイスの全幅まで最大化されます。
    • カスタム:動画がサイドバーエディターで設定されている特定の幅と高さを超えることはありません。[幅][高さ]テキストフィールドに、これらの寸法をピクセルで入力します。
  • [動画の詳細]セクションで、[編集]をクリックして動画の情報をカスタマイズします。

注:動画の詳細に対する変更は、動画がHubSpotのコンテンツツールで使用されるすべての場所に適用されます。


    • 右側のパネルで、[サムネイル画像を変更]をクリックして動画のプレビュー画像を変更します。
    • スライダーをクリックして動画の特定のポイントにドラッグするか、または[カスタム画像をアップロード]をクリックして、コンピューターから新しい画像を追加します。サムネイル画像の下の[完了]をクリックします。
    • ファイル名タイトル説明入力しますこれにより、検索エンジンによって動画の内容が認識されるようになります。
    • [完了]をクリックします。

edit-your-video-details

  • フォームまたはCTAのオーバーレイを動画に追加するには、[オーバーレイ]セクションで、[フォーム]または[CTA]を選択します。
  • 再生ボタンの色を編集するには、[スタイルオプション]をクリックして16進値を入力するか、カラーピッカーをクリックしてを選択します。

edit-your-play-button-s-color

  • [変更を適用]をクリックします。 

リッチ テキスト モジュールにHubSpot動画を追加する(ページ、ブログ記事、ナレッジベース記事のみ)

HubSpot動画は、ウェブサイトページ、ランディングページ、ブログ記事、ナレッジベース記事のリッチテキストモジュールでサポートされています。

  • HubSpotアカウントで、ウェブサイトページ、ランディングページ、ブログ、またはナレッジベースに移動します
  • コンテンツエディターでリッチ テキスト モジュールをクリックします。
  • [挿入]ドロップダウンメニューをクリックしてから、[動画]>[HubSpot動画]を選択します。
  • 右側のパネルで、挿入する動画を選択します。
    • ファイルツールから既存の動画を挿入するには、動画のサムネイル画像をクリックします。
    • 新しい動画を挿入するには、[動画をアップロード]をクリックし、コンピューターから動画を選択します。次に、動画のサムネイル画像をクリックします。

add-video-to-content

  • HubSpot動画機能を有効にしていない場合、ダイアログボックスが表示されます。[新しい機能を有効にする]をクリックして、ユーザーのHubSpot動画を有効にし、サービス利用規約を受け入れます。
  • リッチ テキスト ツールバーで、動画の表示形式をカスタマイズできます。
    • 動画の再生ボタンの色を編集するには、backgroundColorプレイヤーの色のドロップダウンメニューをクリックし、色を選択します16進値またはRGBカラー値を入力するには、[詳細]タブに進みます。
    • テキストブロック内の動画の位置を調整するには、inline alignmentalアラインメント(位置合わせ)アイコンを使用します。
    • 動画のサイズを変更するには、幅と高さのピクセル値を入力します。
    • 動画の周囲のパディングを編集するには、[間隔]ドロップダウンメニューをクリックし、画像アイコンの境界付近でピクセル値を入力します。

フォームまたはCTAオーバーレイを動画に追加する(ページ、ブログ記事、およびナレッジベース記事のみ)

HubSpot動画の上にCTAまたはフォームのオーバーレイを追加できます。このオーバーレイは、動画の再生前に表示することも、動画の終了後に表示することもできます。 

この方法で追加できるCTAとフォームにはいくつかの制限があります。 

  • 新しいCTAまたはフォームを作成する必要があります。
  • オーバーレイCTAのスタイルはボタンになり、カスタム画像はサポートされません。
  • オーバーレイフォームでは、[姓][名]、および[Eメール]フィールドのみを収集できます。
  • オーバーレイフォームはフォーム通知をトリガーしません。[Eメール]フィールドが含まれている場合、またはフォームでEメールアドレスなしでコンタクトを作成できる場合は、コンタクトが作成または更新されます。 

ビデオにオーバーレイを追加するには、次の手順に従います。

  • コンテンツエディターで、動画をクリックしてから、[編集]をクリックします。
  • [オーバーレイ]セクションで、[CTA]または[フォーム]を選択します。
  • [CTA/フォームを作成]をクリックします。
  • 右側のパネルで、[新規作成]をクリックしてから、新しいオーバーレイコンテンツを作成します。
    • ボタンCTAを作成してから、[保存]をクリックします。 
    • フォームの名前、フォントスタイル、ヘッダーメッセージ、およびインライン サンキュー メッセージをカスタマイズします。フォームをカスタマイズしたら、[フォームを追加]をクリックします。
  • 表示時間:動画の再生が開始する直前にオーバーレイコンテンツを表示するか、動画の再生が終了した直後に表示するかを選択します。

add-form-or-cta

動画のパフォーマンスを分析する(ページ、ブログ記事、ナレッジベース記事のみ)

注:動画ビューは現在、マーケティングEメールに追加された動画では利用できません。 


HubSpotページ、ブログ記事、またはナレッジベース記事に動画を追加すると、再生数や動画リテンションなどの測定指標によって動画のパフォーマンスを分析できます。コンテンツ詳細ページ、カスタムレポート、コンタクトタイムラインでこれらの測定指標を確認できます。 

動画の再生回数 

  • 動画の再生について分析します。 
    • 動画再生数:訪問者のブラウザーでページに動画が読み込まれた回数です。

      video-views-on-performance-page
    • 動画リテンション動画コンテンツのどの部分が再生されたかを示す指標。

      video-analytics

コンタクトレコードの動画再生数

注:コンタクトタイムラインとカスタムレポート上の動画アクティビティーは、HubSpot動画にのみ利用できます。URLで埋め込んだ外部動画ファイルについては、同様のトラッキングが行われません。

コンタクトレコードの動画再生数を表示するには、次の手順に従います。

  • HubSpotアカウントにて、[コンタクト] > [コンタクト]の順に進みます。
  • コンタクトの名前をクリックします。
  • 動画再生数別にコンタクトのアクティビティーを絞り込むには、[アクティビティーを絞り込み]をクリックして、[動画の再生回数]チェックボックスを選択します。

filter-by-video-views

カスタムレポートの動画再生数(Marketing Hub Enterpriseのみ

注:コンタクトタイムラインとカスタムレポート上の動画アクティビティーは、HubSpot動画にのみ利用できます。URLで埋め込んだ外部動画ファイルについては、同様のトラッキングが行われません。

カスタム レポート ビルダーで、カスタムレポート内のデータソースとして動画を選択できます。

アカウントアクセス権限を付与されているユーザーは、[トラッキングとアナリティクス]設定でこのデータソースを有効にできます。

  • HubSpotアカウントにて、ナビゲーションバーに表示される[設定アイコン settings]をクリックします。
  • 左側のサイドバーメニューで、[トラッキングとアナリティクス]>[アトリビューション]をクリックします。
  • [インタラクションタイプ]セクションで、[動画を視聴した]スイッチをクリックしてオンに切り替えます。
  • [保存]をクリックします。