Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add /docs/header-ids.md #12443

Merged
merged 1 commit into from
Mar 22, 2024
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
53 changes: 53 additions & 0 deletions docs/header-ids.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
# Custom header IDs for markdown documents
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In the document title, "markdown" should be capitalized as "Markdown" to refer to the proper noun correctly.

- # Custom header IDs for markdown documents
+ # Custom header IDs for Markdown documents

Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
# Custom header IDs for markdown documents
# Custom header IDs for Markdown documents


Html ID attributes are used to create links to specific sections of a document. In markdown, **custom header IDs** should be assigned to all header lines (lines that begin with one-or-more hash marks, `#`).
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Again, "markdown" should be capitalized as "Markdown" when referring to the formatting language.

- In markdown, **custom header IDs** should be assigned to all header lines
+ In Markdown, **custom header IDs** should be assigned to all header lines

Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
Html ID attributes are used to create links to specific sections of a document. In markdown, **custom header IDs** should be assigned to all header lines (lines that begin with one-or-more hash marks, `#`).
Html ID attributes are used to create links to specific sections of a document. In Markdown, **custom header IDs** should be assigned to all header lines (lines that begin with one-or-more hash marks, `#`).


## Markdown syntax

A custom heading ID should follow these rules:

- Placed at the end of a heading line, preceded by a space, followed by a line break
- Wrapped in curly braces
- Starts with a hash-mark
- Uses kebab-case string
- Unique for the current page

For example:

```markdown
## My heading {#my-heading}

### A subheading {#a-subheading}

#### Or a longer title that can be shortened {#long-heading}
```

Note that for short headers, simply lowercasing and using hyphens instead of spaces is sufficient. For longer headers, a shortened concise version of the header is encouraged. Must not repeat the same ID on the same page.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider adding a comma for clarity: "For longer headers, a shortened, concise version of the header is encouraged."

- For longer headers, a shortened concise version of the header is encouraged.
+ For longer headers, a shortened, concise version of the header is encouraged.

Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
Note that for short headers, simply lowercasing and using hyphens instead of spaces is sufficient. For longer headers, a shortened concise version of the header is encouraged. Must not repeat the same ID on the same page.
Note that for short headers, simply lowercasing and using hyphens instead of spaces is sufficient. For longer headers, a shortened, concise version of the header is encouraged. Must not repeat the same ID on the same page.


## How are these used?

When these headers are rendered, they come with a link icon attached to it that can be used to quickly link to that section of the document.

Extending the above example, if we wanted to link to the `A subheading` section of the above document (for example living at path `/docs`), you could use the link`/docs#a-subheading` to link directly to that section.

See a live example on ethereum.org: [https://ethereum.org/en/developers/docs/blocks/#block-anatomy](https://ethereum.org/en/developers/docs/blocks/#block-anatomy)

## When to use custom header IDs

### English content

These should be created for header on every new English markdown document.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The article "the" seems to be missing before "header". It should be "for the header on every new English Markdown document."

- These should be created for header on every new English markdown document.
+ These should be created for the header on every new English Markdown document.

Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
These should be created for header on every new English markdown document.
These should be created for the header on every new English Markdown document.

"Markdown" should be capitalized here as well.

- These should be created for the header on every new English markdown document.
+ These should be created for the header on every new English Markdown document.

Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
These should be created for header on every new English markdown document.
These should be created for the header on every new English Markdown document.


### Translated content

English files are uploaded to Crowdin for translation. Header ID's should be _inherited_ from the English version, and remain unchanged during translation.

This is to ensure that the translated content can be linked to from other documents and external links, without breaking the path. This is similar to why path and filenames are not translated, but remain in English to simplify linking and referencing.

See a live example on ethereum.org: [https://ethereum.org/es/developers/docs/blocks/#block-anatomy](https://ethereum.org/en/developers/docs/blocks/#block-anatomy)

Notice the header ID is still in English (`#block-anatomy`), but links to the Spanish (`/es/`) version of the site, at the correct section.

## When are these not needed?

Markdown files in the repo `/docs` (such as this one) do not require custom header IDs, as they are not yet displayed on the website, and do not have translated versions.
Loading