Envía a los visitantes a secciones específicas con enlaces ancla integrados

Un enlace ancla (o "salto de página") es una URL especial que te lleva a un lugar específico de la página. Por ejemplo, el índice de esta guía contiene enlaces ancla que te dirigen a cada encabezado.

Después de configurar un enlace ancla integrado en una sección de página, puedes vincular a los visitantes a la parte superior de esa sección, independientemente de dónde se encuentre en la página. Esto es útil cuando quieres resaltar secciones específicas para los visitantes o hacer que la información importante sea más accesible.

Los enlaces ancla de secciones de página se admiten en la versión 7.1. Si tu sitio está en la versión 7.0, puedes crear enlaces ancla manualmente en áreas de contenido con bloques de código, o usar enlaces ancla de página de índice integrados en algunas plantillas.

Secciones que se admiten

Puedes configurar enlaces ancla en las siguientes secciones de página:

• Secciones de bloques
• Diseños inteligentes
• Secciones de curso
• Secciones de galería
• Secciones de videos

Nota: No es posible agregar enlaces ancla a secciones de blog, eventos, portafolio o tienda, pero puedes crear un enlace ancla en una sección en blanco encima de una sección no admitida para lograr un comportamiento similar.

Configurar un enlace ancla

Al configurar un enlace ancla, primero crearás el slug del enlace ancla en el editor de secciones de página. Se generará la URL que luego usarás para vincular a los visitantes a la sección.

Paso 1: Crea el slug del enlace ancla 

Para configurar el slug del enlace ancla:

1. Haz clic en Editar en una página, luego desplaza el cursor sobre la sección a la que quieres vincular y haz clic en Editar sección.
2. En Enlace ancla, agrega el slug del enlace ancla en el campo de texto. Este campo incluye un hashtag que no se puede borrar, ya que es una parte obligatoria del slug y cambia automáticamente los espacios por guiones.
3. Haz clic en el icono de Copiar enlace para agregar la URL del enlace ancla a tu portapapeles. La URL copiada usa tu dominio principal. Si no tienes un dominio personalizado, la URL usa tu dominio integrado.

Paso 2: Crea el enlace

A continuación, usa la URL copiada para crear el enlace en el que los visitantes harán clic para llegar a la sección de la página. Puedes usar cualquier tipo de enlace, pero para este ejemplo usaremos un enlace de texto:

1. Agrega un bloque de texto a un área de contenido en otra parte de la página. Para ver los pasos detallados, consulta Agregar contenido con bloques.
2. Escribe el texto que quieres vincular, resáltalo y haz clic en el icono de enlace en la barra de herramientas del bloque de texto.
3. En URL, pega la URL copiada en el paso 1. Debería verse así:

/pageslug#anchorlinkslug

4. Si quieres que el enlace se abra en una pestaña nueva, cambia el control Abrir enlace en una pestaña nueva a Activado.
5. Presiona Enter.

Paso 3: Guardar y publicar

Haz clic en Guardar para publicar tus cambios. El enlace que creaste en el paso 2 ahora lleva a los visitantes a la sección de la página en la que creaste el slug del enlace ancla en el paso 1.

Enlazar a la parte superior o inferior de una página

Puedes vincular a la parte superior o inferior de una página usando enlaces ancla de secciones de página.

Enlace a la parte superior 

Enlazar a la parte superior de una página es útil si el contenido de tu página es extenso y quieres ofrecer a los visitantes una forma conveniente de volver a tu navegación.

Para enlazar a la parte superior de una página:

1. Agrega un slug de enlace ancla a la primera sección de una página como se describe en el paso 1. Puedes usar top como texto del slug.
2. Agrega un enlace a la parte inferior de la página como se describe en el paso 2 y verifica que la opción Abrir enlace en una pestaña nueva esté desactivada. Puedes usar Volver arriba como texto del enlace.
3. Haz clic en Guardar.

Enlazar a la parte inferior

Enlazar a la parte inferior de una página es útil si quieres que los visitantes encuentren información o interactúen con algo en el pie de página, como un bloque de newsletter.

Para enlazar a la parte inferior de una página:

1. Agrega un slug de enlace ancla a la última sección de la página o a una sección en el pie de página de tu sitio como se describe en el paso 1. Puedes usar bottom como de texto del slug.
2. Agrega el enlace donde quieras, como se describe en el paso 2 y verifica que la opción Abrir enlace en una pestaña nueva esté desactivada. Puedes usar Ir al pie de página como texto del enlace.
3. Haz clic en Guardar.

Enlace a secciones que no admiten slugs de enlaces ancla

No puedes vincular directamente a los tipos de sección que no admiten slugs de enlaces ancla. Sin embargo, puedes crear un efecto similar vinculando a una sección directamente encima de la sección no admitida:

1. Agrega una sección en blanco arriba de la sección a la que quieres vincular.
2. Sigue los pasos anteriores para configurar el enlace ancla para que dirija a la sección en blanco.
3. Para evitar el espacio creado por la sección en blanco, haz clic en la sección en blanco, luego Editar sección y desactiva Llenar pantalla.
4. Haz clic en Guardar.

Limitaciones y mejores prácticas

Los enlaces ancla pueden ser una herramienta poderosa para ayudar a los visitantes a navegar por tu sitio, pero es bueno tener algunas cuestiones en mente:

• Solo se pueden usar slugs de enlaces ancla una vez por página. Si hay varios enlaces ancla que usan el mismo slug en la misma página, no funcionarán correctamente.
• El texto de tu slug puede ser el que quieras, pero no puede incluir espacios. El campo del enlace ancla cambia automáticamente los espacios a guiones cuando ingresas el nombre del slug.
• Cuando un visitante hace clic en un enlace ancla, el slug del enlace ancla aparece al final de la URL del sitio en la barra de direcciones del navegador. Asegúrate de que tu slug sea algo que no te importe que sea visible para los visitantes.
• Si cambias tu dominio principal, el slug de la página o el slug del enlace ancla en el futuro, asegúrate de actualizar tus enlaces para que coincidan. Los enlaces ancla no funcionarán correctamente con URL desactualizadas.

Enlaces ancla en la versión 7.0

Las secciones de página y sus enlaces ancla no se admiten en la versión 7.0, pero hay otras formas de configurar enlaces ancla, dependiendo de tu sitio:

• Bloques de código: puedes configurar manualmente enlaces ancla en cualquier área de contenido con bloques de código.
• Enlaces ancla de páginas de índice: algunas plantillas incluyen enlaces ancla integrados con tus páginas de índice, que funcionan de manera similar a los enlaces ancla de secciones de página.