Vincular a un encabezado dentro de un post o tema

:bookmark: This guide explains how to link directly to a heading within a Discourse post or topic, enabling users to navigate long posts efficiently.

:person_raising_hand: Required user level: All users

Adding headings within long posts can make the content more readable and allow users to link directly to specific sections. This can be particularly useful for navigating extensive discussions and documentation.

Summary

This guide covers:

  • Creating headings using Markdown
  • Linking directly to specific headings in a post

Creating headings using Markdown

To create a heading in Markdown, prefix a line of text with one or more # characters. The number of # characters corresponds to the heading level. Here are some examples:

## This is a level 2 heading
Here is a short paragraph afterwards.

### This is a level 3 heading
Here is another short paragraph.

When rendered, it looks like this:


This is a level 2 heading

Here is a short paragraph afterwards.

This is a level 3 heading

Here is another short paragraph.


Linking directly to a heading

To share a direct link to a heading within a post:

  1. Hover over the heading to reveal a link icon next to it: link icon.
  2. Click the link icon to update the URL in your browser’s address bar with the direct link to that heading.
  3. Copy the updated URL from the address bar to share it with others.

Best practices

  • Use descriptive headings to summarize content clearly.
  • Structure your post using hierarchical headings where appropriate.
  • Ensure that headings are consistent and logical for better readability.

FAQs

Can I link to any part of a post?
Yes, as long as it’s a heading properly formatted in Markdown.

Do links to headings work across different posts?
Yes! These links will direct to the header in the post when used in other topics or shared somewhere else.

Additional resources

Last edited by @JammyDodger 2024-07-09T11:12:13Z

Last checked by @hugh 2024-08-08T01:48:04Z

Check documentPerform check on document:
73 Me gusta

No estoy viendo los iconos de los enlaces en este sitio ni en el mío. Ni en FF ni en Chrome.

¿Ha cambiado algo?

Necesitas pasar el ratón por encima del encabezado para que aparezcan:

Paso el ratón por encima y no veo nada.

Parece que hay algo ahí, pero no se muestra ningún icono.

Una pregunta de seguimiento…

Asumo que si cambias el texto del encabezado, el enlace se romperá.

EDIT PARA AÑADIR: No solo cambia el ancla si cambia el título, sino que si insertas otro encabezado antes de los encabezados existentes, el sufijo numérico del encabezado cambia. Esto parece frágil hasta el punto de ser inútil.

La única solución segura sería envolver los encabezados en etiquetas a de html y darle un id, ¿correcto?

Editar de nuevo para añadir: Intenté envolver el texto del encabezado en etiquetas a y simplemente poner etiquetas vacías antes del texto del encabezado. Ninguno de los dos ID funcionó. También probé con spans en su lugar con el mismo fallo.

Sí, puedo encontrarlo en el DOM como un before:

Estoy en Windows 11.

La única forma en que puedo hacer que aparezca el icono de enlace es copiando el enlace y luego abriendo ese enlace (con el # y el id) en una nueva pestaña y yendo allí. Entonces, el icono de enlace se muestra a tiempo completo (sin pasar el cursor por encima), pero aún así, ninguno de los otros iconos de enlace aparecerá al pasar el cursor por encima.

¿Se me permite reflotar esto? Me pregunto si me estoy perdiendo algo obvio sobre cómo enlazar dentro de una publicación.