Web コンテンツオーバーレイ

Web コンテンツオーバーレイを使用すると、Web ページをビュー領域内に表示できます。ユーザーはアプリ内ブラウザーを別途開くことなく、ビュー領域内で Web ページのコンテンツを見ることができます。コンテンツとしては Web URL またはローカル HTML ファイルを指定できます。次の点に注意してください。

  • ローカル HTML ファイルを指定する場合は、目的の .html ファイルおよび関連するファイルやフォルダーを、同じフォルダー内に置く必要があります。記事のコンテンツが作成されると、.html ファイルと同じフォルダーのすべてのファイルがアップロードされるので、その HTML フォルダーは必要なアセットだけに制限します。例えば、.html ファイルを Documents フォルダーに追加する場合、Documents フォルダー内のすべてのファイルおよびサブフォルダーがアップロードされます。
  • モバイル用の URL へと自動的にリダイレクトされる URL については、元の URL(例:http://twitter.com/)ではなく必ずモバイル用 URL(例:http://mobile.twitter.com/)を指定してください。
  • Web コンテンツオーバーレイに HTML アニメーションを指定する場合、オーバーレイを最小遅延(0.125 秒など)の「自動再生」に設定し、アニメーションが適切に再生されるようにします。遅延を設定することで、ページがメモリにプリロードされたときにオーバーレイが自動再生されるのを防ぐことができます。
  • InDesign CS6 以降では、「HTML を挿入」コマンドを使用して YouTube クリップの埋め込みコードを挿入できます。最良の結果を得るために、YouTube の埋め込みコードを編集して、「src=//www.youtube.com」を「src=https://www.youtube.com」に変更してください。オーバーレイを「自動再生」に設定し、オーバーレイの前にポスター画像を追加します。

Web コンテンツオーバーレイを作成するには、次の手順を実行します。

  1. 次のいずれかの操作を行います。

    • 長方形ツールまたは長方形フレームツールでドラッグして、Web コンテンツを表示するフレームを作成します。

    • Web コンテンツのポスターにする画像を配置します。

  2. フレームを選択し、Overlays/Folio Overlays パネルで「Web コンテンツ」を選択します。

  3. 次のいずれかの操作を行います。

    • URL を指定するには、「アセット」フィールドに URL を入力またはペーストします。「http://」を含めて URL 全体を入力します。

    • ローカル HTML ファイルを使用するには、フォルダーアイコンをクリックし、ローカル HTML ファイルを指定します。HTML ファイル(index.html など)は、HTML ファイルで使用される画像やスクリプトが含まれているフォルダーに格納されている必要があります。

  4. 次のいずれかのオプションを指定します。

    自動再生

    このオプションを選択すると、ページがモバイルデバイスに読み込まれるのと同時に Web ページも読み込まれます。遅延の秒数を指定することもできます。対象の HTML が再生するアニメーションの場合、最小遅延を指定します。

    透明な背景

    このオプションを選択すると、Web ページ内の背景が透明に保たれます。ユーザーは背景を透過して背景の DPS コンテンツを見ることができます。選択解除すると、Web コンテンツの背景色が使用されます。

    ユーザーのインタラクティブ操作を許可

    このオプションを選択すると、Web ページに対するユーザーのインタラクティブ操作が可能になります。例えば、ハイパーリンクをタップして別の Web ページに移動できます。

    コンテンツを幅に合わせる

    このオプションを選択すると、オーバーレイファイル内で指定したサイズに収まるように Web ページのサイズが調整されます。選択解除すると、Web ページはデバイスのブラウザーに表示される場合と同じサイズで表示されます。収まりきれない場合は HTML ページの表示が切れることがあります。

    資格情報へのアクセスを許可

    Reading API を参照する Web コンテンツオーバーレイを作成して、Camera API、Geolocation API、デジタル販促用カードおよびカレンダーといった機能を利用できます(Overlays パネルの「API アクセスを許可」オプション)。詳しくは、HTML および JavaScript API を使用して DPS を拡張するを参照してください。

    オーバーレイでは、このオプションを選択するほか、カスタム JavaScript API を HTML コードに追加します。

    また、HTML 記事用にこの種の条件付き HTML コンテンツを Web コンテンツオーバーレイの代わりに作成することもできます。その場合は HTML 記事用に、Folio Producer Editor で「資格情報へのアクセスを許可」オプションを選択します。

 Adobe

ヘルプをすばやく簡単に入手

新規ユーザーの場合

Adobe MAX 2024

Adobe MAX
クリエイティブカンファレンス

10 月 14 日~ 16 日 マイアミビーチおよびオンライン

Adobe MAX

クリエイティブカンファレンス

10 月 14 日~ 16 日 マイアミビーチおよびオンライン

Adobe MAX 2024

Adobe MAX
クリエイティブカンファレンス

10 月 14 日~ 16 日 マイアミビーチおよびオンライン

Adobe MAX

クリエイティブカンファレンス

10 月 14 日~ 16 日 マイアミビーチおよびオンライン