Web サイトや他の記事などにジャンプするハイパーリンクを記事内に作成できます。HTML ベースの記事でハイパーリンクを作成できるほか、InDesign ベースの記事でハイパーリンクパネルまたはボタンパネルを使用できます。

InDesign 記事では、InDesign のボタンアクションやハイパーリンクのタイプによっては、サポートされていない場合があります。ハイパーリンクオーバーレイはスクロール可能フレームおよびスライドショーでサポートされていますが、その他のオーバーレイではサポートされていません。

記事へのリンク設定

他の記事またはコレクションにリンクするには「navto」形式を使用します。

ボタンやハイパーリンクを作成する際に、URL フィールドの「http://」を「navto://」に置き換えます。タイトルではなく、メタデータに表示される記事名またはコレクション名を使用します。

有効な navto 形式は次のとおりです。

navto://[記事名]
navto://[記事名]#n
navto://article/[記事名]

「#n」を付加するとページ番号を指定できます。ドキュメントの先頭ページは 0 なので、#2 という指定は 3 ページへのジャンプを意味します。

コレクションへのリンク設定

navto://collection/[コレクション名]
navto://collection/collectionname?openTo=browsePage
navto://collection/collectionname?openTo=contentView

openTo パラメーターを使って、ターゲットコレクションをブラウザーページに開くか、コンテンツビュー(コレクションの最初のアイテム)に開き、「コレクションを開くときのデフォルト動作」設定をオーバーライドするかどうかを指定します。

navto://collection/topLevelTabletContent(最上位タブレットコレクションに移動)
navto://collection/topLevelPhoneContent(最上位スマートフォンコレクションに移動)
navto://collection/topLevelContent(最上位コレクションに移動)
goto://ApplicationViewState/library (最初に起動したコレクションに移動)

コレクションのコンテキスト内での記事へのリンク設定

navto://collection/[コレクション名]/article/[記事名]

navto://collection/[コレクション名]/article/[記事名] を使用すると、ユーザーは水平方向のスワイプ操作でコレクション内の他の記事を表示できます。navto://[記事名] を使用すると、記事がコレクションのコンテキスト内で表示されないため、ユーザーはスワイプ操作でコレクション内の他の記事を表示することはできません。

追加情報

  • Navto リンクは大文字と小文字が区別されます。
  • InDesign ソースファイルでは、InDesign ファイルのパスを参照するリンクは、アプリでの表示時に機能しません。記事間のリンクには navto 形式を使用してください。

InDesign での navto の例(ハイパーリンクパネルまたはボタンパネル)

navto://biking

navto://biking#2(biking 記事の 3 ページ目にジャンプ)

別の記事のページ 3 にジャンプ
別の記事のページ 3 にジャンプ

URL ベースのハイパーリンクまたはボタンを作成するときに、「navto://」URL を使用して別の記事にジャンプできます。 

HTML ソース記事内の別の記事にジャンプする

HTML 記事から別の HTML 記事にジャンプするには、navto 形式でフォルダー名を指定します。例:

<a href="navto://newsArticle01">ニュース記事を見る</a>

ドキュメント名の後にページ番号を追加することによって、InDesign 記事内の特定のページに移動することもできます。ドキュメントの先頭ページを示すには 0 を、2 ページ目を示すには 1 を指定します。例:

<a href="navto://Cycling#3">サイクリング記事の 4 ページ目に移動する</a>

デフォルトでは、URL のハイパーリンクは iOS デバイスのアプリケーション内ブラウザー内で開きます。HTML 記事内にアプリケーションの外部で開くハイパーリンクを作成するには、次のセクションの説明のとおりに goto://DeviceBrowser?url= 形式を使用します。

HTML 記事内のアンカーにジャンプする

HTML 記事内の特定のページにジャンプすることはできませんが、「navto://[記事名]#[アンカー名]」と入力してアンカーにジャンプすることができます。

例:navto://newsArticle01#part4

注意:

HTML ファイルでアンカーを定義するには、HTML ファイルをテキストエディターで開きます。アンカーを設定する対象のテキスト(<a name="part4"></a> など)に移動し、そのテキストをアンカータグで囲みます。

アプリのインターフェイスにある様々なオプションと同様の動作にするには、以下の goto リンクを使用します。

アプリの起動ページに移動します。

goto://ApplicationViewState/library

「戻る」ボタンと同様に機能します。

goto://FolioNavigation/lastview

「ソーシャルシェア」ボタンと同様に機能します。

goto://ApplicationViewState/share

「検索」オプションと同様に機能します。

goto://ApplicationViewState/search

Android アプリまたはデスクトップ Web Viewer アプリの「設定」オプションを選択した場合と同様に機能します。

goto://ApplicationViewState/settings

iOS のアプリケーション内ブラウザーを使用する代わりに、モバイルブラウザーまたは関連付けられたアプリを開きます。

goto://DeviceBrowser?url=

例:<a href ="goto://DeviceBrowser?url=https://www.adobe.com/jp">Adobe Web サイト</a>

InDesign ベースの記事内のハイパーリンクで外部アプリを開くには、ハイパーリンクまたはボタンオブジェクトを選択し、Overlays パネルで「デバイスのブラウザーで開く」を選択します。

各種の navto://relative 形式を使用して、コレクション内の次、前、最初、または最後の記事に移動できます。例えば、navto://relative/first アクションを持つボタンは、コレクション内の最初の記事に移動します。有効な形式としては、firstlastnextpreviouscurrent があります。reset 形式は AEM Mobile では使用できません。また、5 番目の記事など、位置を指定してコレクション内の特定の記事に移動できます。

例:navto://relative/last(コレクション内の最後の記事に移動)

例:navto://relative/last#last(コレクション内の最後の記事の最後のページに移動)

例:navto://relative/4(コレクション内の 5 番目の記事に移動)

例:navto://relative/4#2(コレクション内の 5 番目の記事の 3 ページ目に移動)

特にページのナビゲーションには、「current」形式が便利です。#previous、#next、#first、#last が使用できます。また、特定のページに移動するには、例えば #3 で記事の 4 ページ目に移動します。

例:navto://relative/current#previous(記事の前のページに移動)

例:navto://relative/current#last(記事の最後のページに移動)

例:navto://relative/current#3(記事の 4 ページ目に移動)

スムーズスクロール記事では、小数またはパーセンテージを使用して、特定の位置に移動できます。

例:navto://myarticle#3.3(スムーズスクロール記事で、4 ページ目の下部と 5 ページ目の上部が表示される位置に移動)

例:navto://myarticle#50%(スムーズスクロール記事の中央部に移動)

例:navto://relative/parent(「戻る」ボタン同様、現在の記事の親ビューに移動)

ほとんどの場合、navto://relative/parent ボタンは「戻る」ボタンと同じように機能します。ソース記事と同じコレクション内にあるターゲット記事に親ボタンが表示されている場合、親ボタンをタップするとコレクションにジャンプし、戻るボタンをタップするとソース記事に戻ります。別のコレクション内の記事にリンクしている場合は、戻るボタンと同様に親ボタンでソース記事に戻ります。

注意:

現時点では、Android Viewer で、navto://relative/last および navto://relative/4 (記事番号)はサポートされていません。

現在、この高度な技術をサポート中ですが、形式が変わる可能性があります。アプリケーションの外部から「ディープリンク」を作成するには、対象の記事やコレクションを公開する必要があります。ディープリンクはプリフライトアプリでは機能しません。

このディープリンク手法は、iOS アプリと Android アプリでのみ機能します。

 

アプリへのリンクを作成する

次のフォーマットを使用して、アプリの外部から AEM Mobile アプリへのリンクを作成します。

dps.<publicationID>://

例:dps.d14ddfea-7e7f-45ee-a2ef-cffc669627aa://

プロジェクトのパブリケーション ID を取得するには、オンデマンドポータル(https://aemmobile.adobe.com)の「コンテンツとレイアウト」セクションに移動し、URL の末尾近くの文字列をコピーします。

「コンテンツ」ダッシュボードでパブリケーション ID をコピー
「コンテンツ」ダッシュボードでパブリケーション ID をコピー

アプリでコレクションへのディープリンクを作成する

次のフォーマットを使用して、アプリでコレクションへのリンクを作成します。

dps.<publicationID>://?viewRef=/publication/<publicationID>/view/<collectionName>

例:dps.d14ddfea-7e7f-45ee-a2ef-cffc669627aa://?viewRef=/publication/d14ddfea-7e7f-45ee-a2ef-cffc669627aa/view/collectionAudioVideo

このリンクからは、コレクションがブラウズページまたはコンテンツビューのいずれに設定されているかに応じて、コレクションのブラウズページまたはコレクションの最初のアイテムが表示されます。

アプリで記事へのディープリンクを作成する

次のフォーマットを使用して、コレクションのコンテキストなしで、アプリの外部からアプリの記事へのリンクを作成します。

dps.<publicationID>://?entityRef=/publication/<publicationID>/article/<articleName>

例:dps.d14ddfea-7e7f-45ee-a2ef-cffc669627aa://?entityRef=/publication/d14ddfea-7e7f-45ee-a2ef-cffc669627aa/article/audio_overlays

「記事のタイトル」ではなく「記事名」を使用することに注意してください。

コレクションのコンテキスト内の記事へのディープリンクを作成する

次のフォーマットを使用して、コレクションのコンテキスト内の記事へのディープリンクを作成します(2015 年 12 月 8 日のリリース以降にビルドされたアプリが必要)。

dps.<publicationID>://?entityRef=/publication/<publicationId>/article/<articleName>&viewRef=/publication/<publicationId>/view/<collectionName>

例:dps.d14ddfea-7e7f-45ee-a2ef-cffc669627aa://?entityRef=/publication/d14ddfea-7e7f-45ee-a2ef-cffc669627aa/article/audio_overlays&viewRef=/publication/d14ddfea-7e7f-45ee-a2ef-cffc669627aa/view/collectionAudioVideo

Web サイトや別のページ、別の記事へのリンクを作成するには、ボタンパネルを使用します。

最適な結果を得るには、ハイパーリンクパネルの代わりにボタンパネルを使用してリンクを作成します。ボタンパネルの方が、柔軟性と信頼性に優れています。

  1. InDesign で、ボタンとして使用できるオブジェクトを作成します。

    例えば、Web サイトにジャンプするボタンを作成する場合は、テキストフレームを作成するか、画像を配置します。

  2. ボタンパネルを開き(ウィンドウ/インタラクティブ/ボタン)、オブジェクトを選択して、オブジェクトをボタンに変換アイコンをクリックします。

  3. イベントの種類として「リリース時」を選択します。

    サポートされているボタンイベントは「リリース時」のみです。

  4. 「アクション」の横のプラス記号をクリックし、サポートされているアクションのいずれかを選択します。

    サポートされているボタンアクション
    サポートされているボタンアクション

    A. サポートされているハイパーリンクボタンのアクション B. サポートされているスライドショーボタンのアクション 

    サポートされているハイパーリンクアクションには、「先頭ページへ移動」、「最終ページへ移動」、「次ページへ移動」、「前ページへ移動」、「URL へ移動」、「サウンド」、「ビデオ」および「ページへ移動」があります。次のステートに移動、前のステートに移動、ステートに移動の各アクションは、スライドショーでサポートされています。

    別の記事にジャンプする場合は、「配置先へ移動」アクションを使用せず、navto 形式の「URL へ移動」アクションを使用します。この記事で後述されている関連セクションを参照してください。

  5. 必要に応じて、ボタンアクションを追加します。

    アクションは順番に実行されます。例えば、最初のアクションがビデオを再生し、2 番目のアクションが別のスライドを表示する場合、ビデオが再生されてからスライドが表示されます。

  6. ハイパーリンクの設定を変更するには、ボタンオブジェクトを選択し、Overlays パネルで以下の設定を指定します。

    アプリで開く

    Viewer 上の Web ビュー内にコンテンツを表示します。mailto:、tel: などの URL にリンクする場合は、このオプションの選択を解除します。

    デバイスのブラウザーで開く

    Viewer 上ではなく、モバイルデバイスのブラウザー(例:iPad のモバイル Safari)にコンテンツを表示します。リンクがユーザーにタップされたときプロンプトを表示するには、「操作を選択」を選択します。

InDesign のハイパーリンクパネルを使用すると、ハイパーリンクを追加できます。ハイパーリンクは、特にテキストに適用するのが有効です。フレームをハイパーリンクにする必要が生じた場合は、ハイパーリンクパネルよりもボタンパネルを使用するとよい可能性があります。ボタンのほうが用途が広く、より安定しているからです。

  1. ハイパーリンクとして使用するフレームまたはテキストを選択します。

  2. ハイパーリンクパネルを開きます(ウィンドウ/インタラクティブ/ハイパーリンク)。

  3. ハイパーリンクパネルで、パネルメニューから「新規ハイパーリンク」を選択します。

  4. 「共有の移動先」の選択を解除します。

    「共有の移動先」はハイパーリンクに名前を付けて再利用可能にするオプションですが、ワークフローではお勧めしません。

  5. ハイパーリンクの設定を変更するには、ハイパーリンクオブジェクトを選択し、Overlays パネルで以下の設定を指定します。

    アプリで開く

    アプリ内の Web ビューにコンテンツを表示します。ユーザーにアプリ外への移動を許可することになる mailto:、tel: などの URL にリンクする場合は、このオプションの選択を解除します。

    デバイスのブラウザーで開く

    Viewer 上ではなく、モバイルデバイスのブラウザー(例:iPad のモバイル Safari)にコンテンツを表示します。リンクがユーザーにタップされたときプロンプトを表示するには、「操作を選択」を選択します。このオプションは、「アプリで開く」が選択されている場合は無効です。

    注意:

    Overlays パネルの設定は、テキストハイパーリンクでは使用できません。テキストハイパーリンクの設定はデフォルトで「アプリで開く」に設定され、変更することはできません。ただし、itms://、tel:、mailto: などの特定のプレフィックスは例外になっており、これらの URL については、外部アプリがデフォルトで開きます。

ハイパーリンクの作成について詳しくは、InDesign のヘルプでハイパーリンクの作成を参照してください。

記事から電子メールメッセージ(mailto:)やテキストメッセージ(SMS)を送信したり、電話(tel:)したりするためのリンクを作成できます。また、YouTube アプリまたは iTunes の楽曲やアルバムを開くリンクを作成することもできます。iOS デバイスで使用するために必要な形式について詳しくは、Apple URL スキームリファレンス(英語のみ)を参照してください。

注意:

InDesign で外部アプリやサービスへのリンクを作成する場合は、必ずボタンを選択し、Overlays パネルで「デバイスのブラウザーで開く」オプションを選択します。

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー