外部メディアファイルを埋め込む

YouTube動画などの外部メディアファイルを、のリッチテキストモジュール（）に埋め込み、ページ、ブログ記事、ナレッジベースの記事に表示できます。動画モジュールは、ページのドラッグ＆ドロップエリアやドラッグ＆ドロップEメールエディターにも埋め込むことができる。 

動画とのインタラクションを追跡するには、、代わりにHubSpotの動画ツール。

始める前に

外部メディアファイルを埋め込む前に、以下の要件と注意事項を確認してください。

制限事項と考慮事項について

• 埋め込み機能では、または oEmbed形式の URL のみがサポートされています。対応しているプロバイダー（YouTubeなど）の完全な一覧については、のoEmbedドキュメント（）をご確認ください。
• YouTubeの非公開動画など、追加のセキュリティ対策が施されたメディアファイルはサポートされていません。

リッチテキストモジュールに外部メディアファイルを埋め込む

リッチテキストモジュールにメディアファイルを埋め込むには、URLをリッチテキストエディタに直接貼り付けるか、外部メディアファイルの埋め込みコードを挿入します。 

メディアファイルのURLを追加する際にエラーメッセージが表示された場合は、代わりに埋め込みコードを挿入することをお勧めします。 

注：外部メディアファイルをマーケティングEメールのリッチ テキスト モジュールに埋め込むことはできません。 

1. 目的のコンテンツに移動します。

   • ウェブサイトページ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ウェブサイトページ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞［ウェブサイトページ］に直接移動します。
   • ランディングページ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ランディングページ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞［ランディングページ］に直接移動します。
   • ブログ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ブログ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞ ［ブログ］に直接移動します。
   • ナレッジベース：HubSpotアカウントで、［その他］をクリックし、［サービス］＞［ナレッジベース］に移動します。アカウントに［その他］が表示されない場合は、［サービス］＞ ［ナレッジベース］に直接移動します。
2. コンテンツの名前をクリックします。 
3. コンテンツエディタで、「」リッチテキストモジュールをクリックします。
4. 左側のサイドバーエディタで： 
   • URL を使用してメディアファイルを埋め込むには、の「Insert」ドロップダウンメニューをクリックし、「Embed」を選択します。ダイアログボックスで、ファイルのURL（）をリッチテキストモジュールに貼り付けてください。 
   • 埋め込みコードを使ってメディアファイルを埋め込むには、「」の「Insert」ドロップダウンメニューをクリックし、「Embed」を選択します。ダイアログボックスに、ファイルの埋め込みコードを貼り付け、「」をクリックします。

外部メディアファイルの形式設定 

1. 目的のコンテンツに移動します。

   • ウェブサイトページ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ウェブサイトページ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞［ウェブサイトページ］に直接移動します。
   • ランディングページ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ランディングページ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞［ランディングページ］に直接移動します。
   • ブログ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ブログ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞ ［ブログ］に直接移動します。
   • ナレッジベース：HubSpotアカウントで、［その他］をクリックし、［サービス］＞［ナレッジベース］に移動します。アカウントに［その他］が表示されない場合は、［サービス］＞ ［ナレッジベース］に直接移動します。
2. コンテンツの名前をクリックします。 
3. コンテンツエディターでリッチ テキスト モジュールをクリックします。
4. リッチテキストモジュールで、「」の埋め込みメディアファイルをクリックします。
5. ツールバーでメディアファイルの位置、間隔、寸法を編集します。 
   • テキストブロック内のメディアファイルの位置を調整するには、inline整列アイコンをクリックします。
   • 動画をレスポンシブにするには、fullWidth全幅アイコンをクリックします。ビデオは表示するデバイスの幅いっぱいに表示されます。
   • ファイルのサイズを変更するには、幅と高さにピクセル値を入力します。
   • ファイルの余白を調整するには、Spacingドロップダウンメニューをクリックし、pixelvaluesフィールドに入力します。

注：<script>タグ付きの埋め込みメディアファイルは動的コンテンツを作成するので、そのようなファイルでは全幅がサポートされません。

6. メディアファイルの詳細設定を編集するには、edit「編集」アイコンをクリックしてください。 
   • ポップアップボックス内の「の埋め込みコード」フィールドで、開発者は埋め込み動画のスタイルや動作を編集できます。 
   • 読み込み動作を設定するには、「iframeの読み込み」ドロップダウンメニューをクリックし、オプションを選択します： 
     • ブラウザーのデフォルト:画像の読み込み動作は訪問者のブラウザー設定によって決定されます。 
     • 遅延：訪問者がページの画像部分に到達したときにのみ、画像が読み込まれます。これにより、ページの読み込み時間が短縮され、SEOが向上します。 
     • 遅延しない：ページが読み込まれるとすぐに画像が読み込まれます。
   • ［適用］をクリックします。

外部メディアファイルを置換する

埋め込まれた外部メディアファイルを置き換える必要がある場合は、元のファイルを削除してから、新しいファイルのURLまたは埋め込みコードを埋め込んでください： 

1. 目的のコンテンツに移動します。

   • ウェブサイトページ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ウェブサイトページ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞［ウェブサイトページ］に直接移動します。
   • ランディングページ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ランディングページ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞［ランディングページ］に直接移動します。
   • ブログ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ブログ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞ ［ブログ］に直接移動します。
   • ナレッジベース：HubSpotアカウントで、［その他］をクリックし、［サービス］＞［ナレッジベース］に移動します。アカウントに［その他］が表示されない場合は、［サービス］＞ ［ナレッジベース］に直接移動します。
2. コンテンツの名前をクリックします。 
3. コンテンツエディターでリッチ テキスト モジュールをクリックします。
4. リッチテキストモジュールで、「」というメディアファイルをクリックし、
5. ポップアップボックスで、「delete 」の「」の削除アイコンをクリックします。
6. に新しいファイルを埋め込むには、上記の手順を繰り返してください。

ビデオモジュールを使用して外部動画を埋め込む 

の動画モジュール（）を使用して、ページやマーケティングメールに外部動画を埋め込みましょう。このモジュールは、ページのドラッグ＆ドロップエリアとドラッグ＆ドロップマーケティングEメールエディターでのみ利用可能です。 

メール内の動画モジュールを使用して、外部動画を埋め込む

1. HubSpotアカウントで、［その他］をクリックし、［マーケティング］＞［Eメール］に移動します。アカウントに［その他］が表示されない場合は、［マーケティング］＞［Eメール］に直接移動します。
2. Eメールの名前をクリックします。
3. サイドバーエディタで、「」の横にある「+ Add」アイコンをクリックします。
4. 検索バーに「video」と入力し、「Video」モジュールをクリックして、メール内にドラッグします。
5. コンテンツエディターで、動画モジュールをクリックしてそのオプションを編集します。
6. 左側のサイドバーエディタで、「」を選択し、「Embed」を「」の動画タイプとして設定します。。
7. 動画URLを入力してください。
8. 左サイドバーのエディターで、動画のサイズ、サムネイル画像、配置を編集します： 

• • widthまたはheightを入力して、ビデオのサイズを変更してください。 
  • 動画のサムネイルをカスタマイズするには、「画像をアップロード」をクリックして、imageをコンピューターからアップロードするか、「画像を参照」をクリックして、imageをfiles toolから追加します。 

についてご注意ください：カスタムサムネイルには、メール内では再生ボタンのオーバーレイが表示されません。エディタのプレビューには、最終的なメール出力ではなく、動画ソースが表示されます。再生ボタンを追加するには、アップロードする前にグラフィック上に直接デザインするか、代わりにデフォルトの動画プロバイダーのサムネイルを使用してください。

• • モバイルデバイスの全幅で動画を表示するには、［モバイルデバイスで最大幅として表示］チェックボックスをオンにします。動画が元の寸法よりも大きい幅で表示されることはありません。 
  • ビデオを右または左に移動するには、整列ドロップダウンをクリックし、左、中央、または右を選択します。
  • 動画の両側にスペースを追加するには、パディングスイッチをクリックしてオンに切り替えます。最上部、最下部、左および右テキストフィールドにパディング用のピクセル値を入力するか、全ての側面に適用チェックボックスを選択して、動画の全ての側面に同じパディングを適用します。

ページ上の動画モジュールを使用して、外部動画を埋め込む

1. 目的のコンテンツに移動します。

   • ウェブサイトページ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ウェブサイトページ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞［ウェブサイトページ］に直接移動します。
   • ランディングページ：HubSpotアカウントで、［その他］をクリックし、［コンテンツ］＞［ランディングページ］に移動します。アカウントに［その他］が表示されない場合は、［コンテンツ］＞［ランディングページ］に直接移動します。
2. ページの名前をクリックします。 
3. 左のサイドバーで、add［追加］アイコンをクリックします。
4. 検索バーに「video」と入力し、次に「Video」モジュールをクリックして、ページ上にドラッグします。
5. 左側のサイドバーエディタで、「」を選択し、「」の動画タイプとして「」を埋め込み、「」を選択します。
6. 動画URLを入力してください。代わりに埋め込みコードを使用するには、埋め込みコードを選択し、埋め込みコードをフィールドに貼り付けます。 
7. 動画の応答性を変更するには、サイズドロップダウンメニューをクリックし、オプションを選択します：
   
   • 自動調整:動画はレスポンシブ、つまりブラウザーやデバイスのサイズに応じて拡大縮小されます。
   • 正確な幅と高さ：あなたのメディアは、全てのデバイス上で常に正確なサイズになります。幅および高さのボックスに、ピクセル値を入力します。 
8. 動画をレスポンシブに設定している場合は、最大サイズドロップダウンメニューをクリックし、オプションを選択してください：
   • 本来のサイズ：動画が本来のサイズを超えて拡大されることはありません。
   • 全幅：動画は視聴に使われるデバイスの全幅まで最大化されます。
   • カスタム：動画がサイドバーエディターで設定されている特定の幅と高さを超えることはありません。［最大幅］ボックスと［最大高］ボックスに、寸法のピクセル値を入力します。
9. 動画のサムネイル画像をカスタマイズするには、[アップロード ]をクリックしてコンピューター上の新しい ファイル を選択するか、[ 画像を参照 ]をクリックして ファイルツールから 画像 を選択します。
10. ［変更を適用］をクリックします。