Markdownで同じドキュメントの一部にリンクする方法は?


541

私は大きなMarkdown文書を書いています。文書のさまざまな場所へのリンクを提供する種類の目次を最初に配置したいと考えています。これどうやってするの?

使ってみた

[a link](# MyTitle)

MyTitleドキュメント内のタイトルはどこにあり、これは機能しませんでした。


1
R Markdown(Rmd)については、stackoverflow.com / questions / 12204257 /… へのリンク。
エティエンヌローデカリー2014年

1
唯一の問題は、MyTitleがタイトルではなく、そのドキュメント内のアンカーの名前であることです(<a name="MyTitle"> </a>など)。その後、ドキュメント内の任意の場所で元のリンクを使用できます。
userfuser 2015年

7
受け入れられた答えは、実際にはほとんどの人に関係ありません。:代わりにダウン二答えを参照stackoverflow.com/a/16426829/398630
BrainSlugs83

回答:


37

pandoc、このオプションを使用する場合--toc HTMLを生成するには、目次はセクションへのリンク、およびセクション見出しから内容のテーブルに戻って生成されます。これは、LaTeX、rtf、rstなど、他の形式のpandoc書き込みと同様です。したがって、コマンド

pandoc --toc happiness.txt -o happiness.html

マークダウンのこのビット:

% True Happiness

Introduction
------------

Many have posed the question of true happiness.  In this blog post we propose to
solve it.

First Attempts
--------------

The earliest attempts at attaining true happiness of course aimed at pleasure. 
Soon, though, the downside of pleasure was revealed.

これは、htmlの本文として生成されます。

<h1 class="title">
    True Happiness
</h1>
<div id="TOC">
    <ul>
        <li>
            <a href="#introduction">Introduction</a>
        </li>
        <li>
            <a href="#first-attempts">First Attempts</a>
        </li>
    </ul>
</div>
<div id="introduction">
    <h2>
        <a href="#TOC">Introduction</a>
    </h2>
    <p>
        Many have posed the question of true happiness. In this blog post we propose to solve it.
    </p>
</div>
<div id="first-attempts">
    <h2>
        <a href="#TOC">First Attempts</a>
    </h2>
    <p>
        The earliest attempts at attaining true happiness of course aimed at pleasure. Soon, though, the downside of pleasure was revealed.
    </p>
</div>

1
おかげで、これはまさに私が必要としたものでした。Textmateを使用してMarkdownをHTMLに変換していたため、pandocに切り替わります。
recipriversexclusion

1
あなたは与えるかもしれないデモPandocのtmbundle tmbundle MultiMarkdown特有のシンタックスハイライトを再使用するため、(非常に)いくつかの奇妙がある(pandoc-モードなどのEmacsもあります)のGithub上のアップを試して。また、関連するスクリプトの多くは高度にカスタマイズされています(たとえば、LaTeXではなくContextなど)。ただし、ユーザーが自由に変更できるという考えです。統合を単純化するためgit cloneに、おそらくtmbundleディレクトリの最下位または最外部に-edする必要があります~/Library/Application\ Support/TextMate/Bundles
応用的

2
これは、追加-1、IDの最初の繰り返しに-2等秒に
応用的

6
実際に目次自体を出力に出力するには、pandocコマンドに--standaloneオプションを追加する必要があることがわかりました。そのスイッチがない場合、ヘッダーは#toc名前付きアンカーへのリンクに戻りますが、実際には名前付きアンカーと同様のリストを出力しません。
ダンカンロック

4
これはOPの質問に答えるかもしれませんが、markdownでそれを行う方法を知りたいと思っている残りの人にとっては、それはかなり役に立ちません。-次の答えは、はるかに役立ちます。
BrainSlugs83

936

Githubは、ヘッダーからアンカータグを自動的に解析します。したがって、次のことができます。

[Custom foo description](#foo)

# Foo

上記の場合、Fooヘッダーは次の名前のアンカータグを生成しましたfoo

#すべての見出しサイズに1つのみ#、アンカー名とアンカー名の間にスペースはありません。アンカータグ名は小文字で、マルチワードの場合はダッシュで区切る必要があります

[click on this link](#my-multi-word-header)

### My Multi Word Header

更新

箱から出してpandocでも動作します。


54
ヘッダーに「Like this one」のように複数の単語が含まれている場合は、アンカーのスペースをハイフンに置き換えます[just](#like-this-one)
Mogsdad 2016

3
これはH1ヘッダーに対してのみ機能しますか?H2ヘッダー(## Foo)にリンクしている場合、リンクに2つの番号記号([Foo](## foo))も配置する必要がありますか?私はあなたの構文または私のものを(余分な番号記号で)動作させることができません。
GrayedFox 2016年

7
@ GrayedFox、ab H2ヘッダーのリンクを作成する場合## Fooは、[これはFooへの私のリンクです](#foo)...を試してください:単一のハッシュ、ハッシュと小文字のケバブケース名の
Abdull

4
ヒントとして:Githubのヘッダーの横に表示されるアンカーをチェックして、それぞれのリンクを取得します。つまり、特殊文字が含まれている場合、それらは自動的に削除され、正しいリンクがそこに表示されます。
Alexander Pacha 2017

2
見出しに番号が付いている場合はどうですか?#3. 3番目のポイント[3番目のポイント](#3.-third.point)が機能しない
Aditya

118

実験して、私は使用している解決策を見つけました<div…/>が、明白な解決策は、ページ内の好きな場所に独自のアンカーポイントを配置することです。

<a name="abcde">

以前

</a>

「リンク」したい行の。次に、次のようなマークダウンリンク:

[link text](#abcde)

ドキュメントのどこにでも移動できます。

<div…/>解決策は、単に追加するには、「ダミー」部門を挿入するidプロパティを、これはページ構造に潜在的に破壊的であるが、<a name="abcde"/>解決策は非常に無害であるべき。

(PS:アンカーを入れてOKかもしれない中で次のようにあなたは、にリンクしたい行:

## <a name="head1">Heading One</a>

しかし、これはMarkdownがこれをどのように扱うかに依存します。たとえば、Stack Overflowの回答フォーマッターはこれで満足です!)


2
これを行う場合、divはなどの他のマークダウン形式を削除することに注意してください## headers
2rs2ts

@ user691859詳しく説明できますか?おそらく、回答を更新してより適切に機能させることができます。TextMateはdivをインデントするまで強調表示を抑制しましたが、ブラウザーから表示された処理済みマークダウンには問題ありませんでした。
Steve Powell、

WriteMonkeyで、テキストの前に<div/>以下の数行が含まれていると影響を受けることがわかりました。代わりに、リンクするテキストを完全なdivタグ句でラップする必要があり、実際のHTMLを使用して動作を最初から再指定する必要があります。ブー。
2rs2ts

6
これはうまくいきます、ありがとう。疑問に思う方のために、これはGitHubでホストされ表示されるMarkdownファイルでも機能します。
Alex Dean

2
HTML5との上位互換性を保つために、で置き換えることをお勧め<a name="head1"/><a id="head1"/>ます。
binki 2013年

74

これは古いスレッドである可能性がありますが、Githubの
マークダウンで内部ドキュメントリンクを作成するには、次のように使用します(注:小文字の#title)

    # Contents
     - [Specification](#specification) 
     - [Dependencies Title](#dependencies-title) 

    ## Specification
    Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. 

    ## Dependencies Title
    Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. 

良い質問がなされたので、私の回答を編集しました。

内部リンクは、使用して、任意のタイトルの大きさにすることができる- 、#、、## 私は下に...簡単な例を作成し https://github.com/aogilvie/markdownLinkTest#######


あなたの例では、リンクタグには#が1つしかありませんが、リンクすることになっているヘッダーには2つの##があります。彼らは同じではないのですか?
Karim Bahgat 14

3
良い質問。答えはノーだ。#(#dependencies-title)はGithubマークダウンにこれが内部リンクであることを伝えます。次のテキストは、任意のタイトルサイズにすることができます。これが私が作ったテストの例です... https://github.com/aogilvie/markdownLinkTest
Ally

1
それはマークダウンの味に依存しますか?マークダウンエディターでは正常に動作するようですが、htmlまたはpdfに保存すると、IDが適切なタグに追加されません。私はそこにアンカーをダンプするだけで大​​丈夫ですが、あなたの方法はとてもきれいで速いようです。
meteorainer 2014

21

はい、markdownはこれを行いますが、名前anchorを指定する必要があります<a name='xyx'>

完全な例、

これはリンクを作成します
[tasks](#tasks)

ドキュメントの後半で、名前付きアンカー(名前は何であれ)を作成します。

<a name="tasks">
   my tasks
</a>

ヘッダーで囲むこともできます。

<a name="tasks">
### Agile tasks (created by developer)
</a>

13

pandocマニュアルでは、識別子を使用してヘッダーにリンクする方法について説明しています。他のパーサーによるサポートについては確認しませんでしたが、githubでは動作しないことが報告されてます。

識別子は手動で指定できます。

## my heading text {#mht}
Some normal text here,
including a [link to the header](#mht).

または、自動生成された識別子(この場合は#my-heading-text)を使用できます。どちらもpandocマニュアルで詳細に説明されています

:これHTMLLaTexConTeXtTextile、またはAsciiDocに変換する場合にのみ機能します


9

屋がこれまでに取得した場合心に留めておくべきいくつかの追加のもの空想を屋にナビゲートすることを見出し内のシンボルと...

# What this is about


------


#### Table of Contents


- [About](#what-this-is-about)

- [&#9889; Sunopsis](#9889-tldr)

- [:gear: Grinders](#it-grinds-my-gears)

- [Attribution]


------


## &#9889; TLDR


Words for those short on time or attention.


___


## It Grinds my :gear:s


Here _`:gear:`_ is not something like &#9881; or &#9965;


___


## &#9956; Attribution


Probably to much time at a keyboard



[Attribution]: #9956-attribution

...のようなもの#;&、と:の見出しの文字列の中には、一般的に/無視してストライプの代わりに、エスケープ、および1も使用することができますされている引用簡単に素早く利用するために、スタイルのリンクを。

ノート

GitHubは、:word:コミット、readmeファイルなどの構文をサポートしています。要点を using'emが重要である場合(rxaviersからの)。

そして、ほとんどすべての場所で、10進数または16進数を最新のブラウザーに使用できます。w3schoolsのチートシートは、特にCSS やシンボル付きの疑似要素を使用するスタイルに合っている場合は、非常に便利です。::before::after

ボーナスポイント?

万が一、見出し内の画像やその他のリンクがどのように解析されて、 id ...

- [Imaged](#alt-textbadge__examplehttpsexamplecom-to-somewhere)


## [![Alt Text][badge__example]](https://example.com) To Somewhere


[badge__example]:
  https://img.shields.io/badge/Left-Right-success.svg?labelColor=brown&logo=stackexchange
  "Eeak a mouse!"

注意事項

MarkDownレンダリングは場所によって異なるため、次のようなものです...

## methodName([options]) => <code>Promise</code>

... GitHubには次の要素があります idます...

id="methodnameoptions--promise"

... バニラの衛生が結果としてid ...

id="methodnameoptions-codepromisecode"

...その書き込みを意味するか、テンプレートから値下げファイルをコンパイルのいずれか1つの方法を対象とする必要がslugifeing、または様々なために構成およびスクリプトロジックを追加する巧妙な場所は、見出しのテキストをきれいにしたいということな方法。


9

ユニバーサルソリューション

この質問は、マークダウンの実装によって異なる答えを持っているようです。
実際、公式のMarkdownドキュメントはこのトピックについては触れていません。
このような場合、およびポータブルソリューションが必要な場合は、HTMLを使用できます。

ヘッダーの前、または同じヘッダー行で、HTMLタグを使用してIDを定義します。
例えば:<a id="Chapter1"></a>
これはコードに表示されますが、レンダリングされたドキュメントには表示されません。

完全な例:

完全な例(オンラインおよび編集可能)はこちらを参照してください。

## Content

* [Chapter 1](#Chapter1)
* [Chapter 2](#Chapter2)

<div id="Chapter1"></div>
## Chapter 1

Some text here.  
Some text here.
Some text here.

## Chapter 2 <span id="Chapter2"><span>

Some text here.  
Some text here.
Some text here.

この例をテストするには、コンテンツリストと最初の章の間にスペースを追加するか、ウィンドウの高さを低くする必要があります。
また、IDの名前にスペースを使用しないでください。


ええと...、いい感じだった。それを試して、2つの問題:(1)。## Chapter 1その上に開いた線が必要です。(2)。リンクが機能しない...
musicformellons

ああ、私が使ったintellij markdownプラグインでは動作しません。ただし、Macdownマークアップエディタでは機能しません。
musicformellons

それでも、githubでテストされています。ヘッダーの上に開いた行が必要ですが、機能します。
musicformellons

@musicformellons開始行なしで、spanタグを適切に閉じてみてください。<br><span id="Chapter1"><span>
ePi272314

ええ、それはうまくいきます!
musicformellons

7

Markdown仕様にはそのようなディレクティブはありません。ごめんなさい。


ええとああ!MultiMarkdownまたはTextileがサポートしているかどうか知っていますか?すべてのドキュメントをMDに移行することを考えていましたが、これは取引ブレーカーです。助けてくれてありがとう!
recipriversexclusion

5
「ディレクティブ」とはどういう意味ですか?問題を正確に解決するための他のソリューションがここに掲載されています。
Zelphir Kaltstahl、2016年

4

GitlabはGitLab Flavored Markdown(GFM)を使用します

ここで「すべてのMarkdownでレンダリングされたヘッダーは自動的にIDを取得します」

マウスを使用して次のことができます。

  • ヘッダーの上にマウスを移動
  • ヘッダーから左側に表示されるホバーセレクターの上にマウスを移動します
  • 右クリックでリンクをコピーして保存

    たとえば、README.mdファイルにはヘッダーがあります。

## series expansion formula of the Boettcher function

リンクを与える:

https://gitlab.com/adammajewski/parameter_external_angle/blob/master/README.md#series-expansion-formula-of-the-boettcher-function

プレフィックスを削除できるので、ここのリンクは単純です

file#header

ここでの意味:

README.md#series-expansion-formula-of-the-boettcher-function

今では次のように使用できます:

[series expansion formula of the Boettcher function](README.md#series-expansion-formula-of-the-boettcher-function)

手動で行うこともできます。スペースをハイフン記号に置き換えます。

ライブ例はこちら


1

kramdownを使用すると、これはうまくいくようです:

[I want this to link to foo](#foo)
....
....
{: id="foo"}
### Foo are you?

それが言及されているのを見る

[foo][#foo]
....
#Foo

効率的に機能しますが、前者はヘッダー以外の要素や、複数の単語を含むヘッダーに適した代替手段になる場合があります。


1

MultiMarkdownがコメントのオプションとして言及されたので。

MultiMarkdown内部リンクの構文は単純です。

ドキュメントの見出しについては、この形式で見出し名[heading][]を指定するだけで、内部リンクが作成されます。

詳細については、MultiMarkdown-5相互参照をご覧ください。

クロスリファレンス

よくリクエストされた機能は、Markdownが外部リンクを処理するのと同じくらい簡単にドキュメント内リンクを自動的に処理する機能でした。この目的のために、「Some Text」という名前のヘッダーが存在する場合、[Some Text] []をクロスリンクとして解釈する機能を追加しました。

例として、[メタデータ] []は、#メタデータ(または##メタデータ、###メタデータ、####メタデータ、#####メタデータ、######メタデータ)に移動します。

あるいは、選択したオプションのラベルを含めて、複数のヘッダーが同じタイトルを持つ場合を明確にすることができます。

###概要[MultiMarkdownOverview] ##

これにより、[MultiMarkdownOverview]を使用してこのセクションを具体的に参照することができ、Overviewという別のセクションを参照することはできません。これは、atxスタイルまたはsettextスタイルのヘッダーで機能します。

ヘッダーで使用されているのと同じIDを使用してアンカーを既に定義している場合は、定義されたアンカーが優先されます。

ドキュメント内のヘッダーに加えて、相互参照にも使用できる画像や表のラベルを提供できます。


0

<a name="">トリックのいくつかのスピン:

<a id="a-link"></a> Title
------

#### <a id="a-link"></a> Title (when you wanna control the h{N} with #'s)

0

上記の回答に加えて、

number_sections: trueYAMLヘッダーでオプションを設定する場合:

number_sections: TRUE

RMarkdownはセクションに自動番号を付けます。

これらの自動採番セクションを参照するには、Rマークダウンファイルに次の行を追加するだけです。

[My Section]

My Sectionセクションの名前はどこですか

これはセクションレベルに関係なく機能するようです。

# My section

## My section

### My section

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.