Skip to content

Instantly share code, notes, and snippets.

@rachelhyman
Last active February 21, 2024 18:20
Show Gist options
  • Star 52 You must be signed in to star a gist
  • Fork 6 You must be signed in to fork a gist
  • Save rachelhyman/b1f109155c9dafffe618 to your computer and use it in GitHub Desktop.
Save rachelhyman/b1f109155c9dafffe618 to your computer and use it in GitHub Desktop.
Github README anchor links

To create anchor links that jump down to different sections of a README (as in an interactive table of contents), first create a heading:
#Real Cool Heading

The anchor link for that heading is the lowercase heading name with dashes where there are spaces. You can always get the anchor name by visiting the README on Github.com and clicking on the anchor that appears when you hover to the left of the heading. Copy everything starting at the #:
#real-cool-heading

Wherever you want to link to your Real Cool Heading section, put your desired text in brackets, followed by the anchor link in parentheses:
[Go to Real Cool Heading section](#real-cool-heading)

See! Easy: Go to Real Cool Heading section

#Real Cool Heading
This is a real cool heading with some real cool content.

@ChairBearPro
Copy link

Take into account to:

  • Make all lowercase
  • Remove anything that is not a letter, number, space or hyphen, like :, ', etc
  • Change any space to a hyphen.

Reall nice!

@Heatescape
Copy link

@sergeiudris

painfully, github's markdown/rst/asciidoc do not allow to give a header a custom anchor id/link

Actually, it does. Here's how:

<a name="custom_anchor_name"></a>
# some header

Now, link to it with:

[click here to jump to my anchor](#custom_anchor_name)

I do that in my readme here: https://github.com/ElectricRCAircraftGuy/AlfaWiFiAdapterSoftware.

Ex: https://github.com/ElectricRCAircraftGuy/AlfaWiFiAdapterSoftware#AWUS036NH

Something else you might find useful:

  1. center and resize images: https://github.com/ElectricRCAircraftGuy/eRCaGuy_hello_world/blob/master/markdown/github_readme_center_and_align_images.md

life saver!

@ElectricRCAircraftGuy
Copy link

ElectricRCAircraftGuy commented Nov 24, 2022

@Heatescape 😄
Glad it helped.

@ShortyDev
Copy link

For anyone still wondering how it works, you can use

[Starting the application](#starting-the-application)

simply with the header # Starting the application

@yCodeTech
Copy link

<a name="custom_anchor_name"></a>
# some header

There is a caveat which is missed on here, doing this doesn't change the header anchor to custom_anchor_name, the header will stay as it's written, what it actually does is creates a new anchor link above the header for you to link to instead. But this doesn't account for the Github users knowing this, and clicking the header link to grab it's URL.

I wish there was a way to actually change the header anchor instead of doing this, but doesn't look like there is.

@timony
Copy link

timony commented Sep 13, 2023

[Fancy link](wiki#section-name) for ### Section name
works for me

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment