Create a link to the header of another page in Github

Question

Does anyone know how to create a link to the header of a different wiki page?

I know if I have a header ##Header name that I can link to it on that page by using (#header-name) as my link, but I want to link to that header from a different page. Is this possible?

ie. I want to have a table of contents that can link to the sub-sections of each wiki page as well as to the page itself.

Edit: I mean a way besides just using the url link
http://github.com/project/wiki/Wiki-Page#header-name

score 7 · Accepted Answer · edited Nov 09 '21 at 10:45

EDIT 1: So totally wrong about before, I just read up a bit more. So we have this new support as well inside of GitHub Wikis! (Relatively new.)

You can also do something like this:

[[ Link text | page_title#header_title ]]

This might work a lot better for you! TIL because of this answer here. You can see me do this with the Prerequisite link and you can see my other links work the other way. Time for me to do some updates!

EDIT 1: Still useful but definitely NOT THE ONLY WAY.

So I answered a question about this before, you should avoid absolute links on GitHub (i.e. https://github.com/user/repo_name/...)

However, a good way (and kind of the only way inside of Wikis EDIT 1: TOTALLY NOT TRUE TO BEING THE ONLY WAY) of doing what you need can be seen like this:

[Header link](/user/repository_name/wiki/page_name#title).

This is kind of the linking unfortunately that the Wiki would support. This will change your directory page based off of GitHub. You can see that it would be

https://github.com/(the linkage you want to hit)

I have actually began doing something like this in a Wiki I work on here. Inside of my Sidebar, you can see I have a Getting Started Page, and then a subsection into it is a Prerequisite heading and it will properly lead people to where they need to go. You would be able to perform this same thing on any page. It is a tad verbose, but worth it as you can easily change things around if need be. This is also case-sensitive since it will change their location so be sure that in your linkage, the page is the proper case and your heading is all lowercase.

Hope this helps!

Only `[Header link](/user/repository_name/wiki/page_name#title)` worked for me, but note that the url is relative if you don't use a preceding slash. — Ninjakannon, Mar 01 '19 at 14:43

score 4 · Answer 2 · answered Nov 25 '17 at 07:22

You can link to the header by simply assigning an id to header. e.g you've "Extension" header in a page called Abc. # <a id="extension"></a> Extensions
You have another page "Call center" and you want to go to extension in abc , you can use reference linking of markdown i.e "The [extensions][1] are handled by agents" [1]: url-of-abc/#extension

Neil Anuskiewicz · Answer 3 · 2016-08-17T17:16:06.453

0

I tested Maxwell's "good way" to link to the header of another page in Github in Edit 1 on and it works perfectly.

#[crux-ports Installation](/user/crux-ports/blob/master/README.md#installation)

edited Aug 17 '16 at 17:16

answered Aug 17 '16 at 05:25

Neil Anuskiewicz

478
2
12

No it doesn't work, it will just try to go to that header on the current page. – annedroiid Aug 17 '16 at 05:45
Couldn't throw some HTML in there? `Link Text` My understanding is you can put HTML anywhere in a Markdown document. – Neil Anuskiewicz Aug 17 '16 at 08:19

score 0 · Answer 4 · answered Jul 02 '21 at 15:28

markdown generate slug for the heading and convert it to id, example

# [ topic ][ color ]

will be converted to

<h1 id="topic--color" data-line="643" class="code-line">[ topic ][ color ]</h1>

Thus, to link it you can write it as [color](#topic--color).

If the destination anchor is on another page (assume filename css.md) with path relative to current markdown page, then you can write it as [color](css.md#topic--color)

Attach the slugify function from vscode

// excerpt from https://github.com/yzhang-gh/vscode-markdown/blob/908d7ba5465a203e4299f346c179211d992ef468/src/util/slugify.ts

const str = '# [ topic ][ color ]';

const slug = encodeURI(
            str.trim()
                .replace(/\s+/g, "-") // Replace whitespace with -
                .replace(/[\]\[\!\'\#\$\%\&\'\(\)\*\+\,\.\/\:\;\<\=\>\?\@\\\^\_\{\|\}\~\`。，、；：？！…—·ˉ¨‘’“”々～‖∶＂＇｀｜〃〔〕〈〉《》「」『』．〖〗【】（）［］｛｝]/g, "") // Remove known punctuators
                .replace(/^\-+/, "") // Remove leading -
                .replace(/\-+$/, "") // Remove trailing -
        );
        
 console.log(slug) // "topic--color"

Create a link to the header of another page in Github

4 Answers4