質問

記事内に手動でアンカーリンクを作成するにはどうすればよいですか?

回答

ナレッジベースを使用して、編集者のツールバーにある「リンクの挿入/編集」を選択して記事にアンカーを追加することができます。次の記事を参照してください:「記事へのリンクの挿入と編集」

edit link.png
この機能を使用する場合、カスタマーがアンカーリンクを選択したときに、見出しが表示されません。この問題を回避するには、アンカーリンクを記事の「ソースコード」内に作成します。

アンカーリンクを手動で作成するには

  1. 記事エディタを開いて「HTML」アイコンを選択します。
  2. リンクを使用してターゲットに設定するテキストに移動します。以下のコードスニペットをテキストの前に挿入します(通常、同じ行に挿入します)。

    id="your_anchor_name">
  3. 目的のアンカーリンク名を入力します。以下に例を示します。id="your_anchor_name">
    html code example.png
  4. これらの2つのオプションのいずれかを選択して、アンカーにリンクします。

オプション1

  1. リンクとして使用するテキストを選択し、「リンクの挿入/編集」アイコンをクリックします。
  2. 「見出し」タブ(編集者バージョンで表示している場合は「アンカー」タブ)>を選択して、追加したアンカー名を見つけ、目的のアンカーを選択します。
  3. 「リンクを追加」をクリックします。

オプション2:

  1. 「ソースコード」エディタで、リンクに含めるテキストを探します。次に、アンカーターゲットのidを指すテキストを以下のようにタグで囲みます。

    <a href="#your_anchor_name">Link text</a>

    以下に、「Section I」をリンクに含める場合の例を示します。

    最初に、セクション見出しで一意のid属性を指定して、アンカーターゲットを設定します。

    <h2 id="section1">Section I</h2>

    次に、リンクコードを以下のように変更します。

    <li>Section I</li>

    以下に変更しました:

    <li><a href="#section1">Section I</a></li>

    リンクテキストを開始および終了<a>タグで囲んでください。そうしないとユーザーはクリックすることができません。

    以下の例は、記事が保存される前のリンクがエディタの背後でどのように見えるかを示しています。
    example html code.png
    2.「適用」をクリックして変更内容を保存します。

アンカーが予想される位置よりも数行下にある場合、画面上部のツールバーが干渉している可能性があります。その場合は、ツールバーを最小化して、もう一度アンカーリンクをテストしてください。

完全なURL、#記号、アンカーのid値を使用して、別のページのアンカーターゲットにリンクすることもできます。以下に例を示します。

<a href="https://support.zendesk.com/entries/98542436#some_anchor_name"></a>

ハッシュタグ(例:href="#section1")だけを使用する場合は、アンカーターゲットが同じページ上にある場合にのみ機能します。ターゲットが別のページにある場合は、最初に完全なURLを含めてから#id_valueを使用する必要があります。

アンカーリンクを数行分下に挿入するのではなく、ヘッダーに挿入する場合は、見出しと本文の間に改ページをいくつか含めます。

詳細については、次の記事を参照してください:「記事へのリンクの挿入と編集」

Powered by Zendesk