1.7 Enlaces de anclaje (enlaces de salto)

✔️ Con enlaces de anclaje (enlaces de salto), puedes crear navegación dentro de un mapa. Para ello, defines enlaces de anclaje con nombres propios en tus cajas y los enlazas, por ejemplo, mediante una tabla de contenido en una caja.

1

Supongamos que quieres crear una tabla de contenido. Sigue estos pasos:
1. Abre la caja a la que quieres enlazar con el editor de cajas.
2. Haz clic en “Elementos” y selecciona “Enlace de anclaje” en el menú desplegable.
Enlace de anclaje en el menú desplegable del editor de cajas
1. Se insertará !#anchor en el contenido de la caja (como plantilla).
2. Cambia el nombre del anclaje como quieras, por ejemplo a !#start1. Asegúrate de que la palabra del anclaje sea una sola palabra y de que los caracteres !# estén colocados directamente delante de la palabra (sin espacios, todo en minúsculas).
3. Guarda la caja.
El enlace de anclaje ahora está vinculado a la caja y puede usarse para la navegación (enlace).
⚙ create

2

Si un enlace de anclaje está asociado a una caja, verás la palabra del anclaje en el modo de edición de la siguiente manera:
Enlace de anclaje visible en el contenido de la caja
Ahora puedes usar este enlace para la navegación.
1. Abre el editor de cajas de la caja en la que se debe añadir el enlace.
2. Escribe tu texto.
3. Selecciona una palabra en el texto con el ratón y haz clic en el botón "Insertar enlace".
4. Introduce tu enlace de anclaje, por ejemplo !#start1.
5. Guarda la caja.
Enlazar texto con un enlace de anclaje
⚙ linking

3

Cuando haces clic en el enlace proporcionado, el mapa se desplazará hasta la caja enlazada (donde se encuentra el enlace de anclaje) y la caja parpadeará tres veces.
Saltar a la caja enlazada con enlace de anclaje
Además, aparecerá un pequeño botón de retroceso en la parte inferior izquierda de la caja.
Sin embargo, también puedes usar el botón Atrás del navegador (o el botón Atrás de tu ratón) para volver a la caja anterior.
⚙ navigation

4

En el siguiente mapa de ejemplo, puedes ver cómo funciona la navegación con enlaces de anclaje.
Ejemplo: tabla de contenido con enlaces de anclaje LINK
Si haces clic en un enlace de la tabla de contenido, la vista se desplaza hasta la caja correspondiente.
Si usas el botón Atrás de la caja o el botón Atrás del navegador, la navegación vuelve a la tabla de contenido.
⚙ example

5

Los enlaces de anclaje también pueden insertarse en títulos de cajas y títulos de columnas.
Para ello, simplemente usa la sintaxis !#myanchor y añádela al final del título.
⚙ titles

6

Los enlaces de anclaje pueden usarse para la navegación interna del mapa. Por ejemplo, para una lista de todos los cursos en la primera caja del mapa o para una tabla de contenido.
Sin embargo, también puedes añadir un enlace de anclaje a tu enlace para compartir el mapa para enlazar directamente a cualquier caja también en otros mapas.
Para hacerlo, simplemente añade el enlace de anclaje al final del enlace para compartir el mapa con #myanchor (sin signo de exclamación).
Cuando luego abras este enlace, se desplazará automáticamente hasta la caja enlazada y la caja parpadeará.
⚙ anchorlinks

7

Ten en cuenta las siguientes reglas:
- Los enlaces de anclaje siempre constan de una sola palabra sin espacios.
- Escribe siempre los enlaces de anclaje en minúsculas. Evita las mayúsculas.
- Evita los caracteres especiales (excepto el signo de exclamación y el signo hash al principio).
Incorrecto:
!#my Anchor
Correcto:
!#myanchor
⚙ format

8

Los enlaces de anclaje también pueden establecerse en etiquetas de texto. Esto permite aplicaciones adicionales:
1. Saltar de una etiqueta de texto a otra etiqueta de texto
2. Saltar de una etiqueta de texto a una caja
3. Saltar de una caja a una etiqueta de texto
Al saltar a una etiqueta de texto, la etiqueta de texto parpadea tres veces y se marca brevemente en rojo.
Saltar a la etiqueta de texto enlazada con un enlace de anclaje
Entrada para la etiqueta de texto de destino:
My text here !#target
Entrada para la etiqueta de texto con el enlace:
My {link to the text label}{!#target}
⚙ textlabels