Añadir enlaces ancla a una página de índice

En la versión 7.0, las páginas de índice apiladas tienen una estructura de URL única que puedes utilizar para crear enlaces ancla (o “saltos de página”) sin código personalizado. Estos enlaces ancla te llevan a lugares específicos de la página de índice. 

Por ejemplo, cuando haces clic en el botón Ver nuestro trabajo en el sitio de demostración de la plantilla de Hayden, se desplaza hacia abajo en la página hasta la sección "Moreau".

Esta guía es para páginas de índice de la versión 7.0. Para agregar enlaces ancla en la versión 7.1 o en otros tipos de páginas en la versión 7.0, visita Cómo crear enlaces ancla.

Plantillas admitidas

Los enlaces ancla de la página de índice funcionan mejor en las plantillas con páginas de índice apiladas. En estas familias de plantillas, hacer clic en un enlace ancla te lleva a la sección correspondiente en la página de índice.

• Bedford
• Brine: la carga de Ajax puede interferir con la conducta del enlace ancla. Como alternativa, puedes usar la navegación del índice integrada.
• Pacific: debes agregar -section al final del enlace. Ve el Paso 3 a continuación para informarte mejor.

Consejo: algunos índices en cuadrícula admiten funciones similares. También puedes usar código personalizado para agregar enlaces ancla comunes a cualquier plantilla.

Paso 1: Encuentra el slug

En el panel de Páginas, pasa el cursor sobre la sección de Índice con la que desees enlazar. Haz clic en para abrir la Configuración de página de esa sección.

Copia el slug del campo Slug de URL. Usarás este slug para crear el enlace ancla.

Consejo: el slug puede aparecer en la barra del navegador cuando los que visitan el sitio navegan a esa sección. Puedes cambiar el slug escribiendo el texto nuevo en este campo.

Paso 2: Crea el enlace

Agrega el enlace en el que harán clic los que visitan el sitio. Puedes usar cualquier tipo de enlace, pero estos pasos usan un enlace de texto como ejemplo. En un bloque de texto, resalta el texto y haz clic en el ícono del Enlace en la barra de herramientas del bloque de texto.

Consejo: el índice de cada plantilla ofrece opciones únicas. Para informarte mejor, consulta la guía de la familia a la que pertenece tu plantilla: Bedford, Brine o Pacific.

Paso 3: Agrega el slug de página

A continuación, sigue estos pasos:

1. En el campo Enlace, pega el slug que copiaste en el paso 1.
2. Agrega el símbolo de numeral (#) al frente del slug para completar el enlace. El enlace ancla de este ejemplo es #horario-y-ubicación.
3. Haz clic en para abrir la configuración y comprobar que Abrir en una ventana nueva esté desactivado.
4. Solo para las plantillas Pacific, Charlotte, Horizon y Naomi, agrega -sección al final del enlace ancla, así: #horario-y-ubicación-sección.
5. Haz clic en Guardar.

Paso 4: Añade el slug del Índice

Si añadiste tu enlace del paso 2 a una sección dentro del mismo índice, puedes saltarte este paso.

Para cualquier otro enlace, como enlaces de navegación o enlaces en otras páginas, incluye el slug de la página de índice antes del enlace ancla. De esta manera, se garantiza que tus enlaces funcionen desde:

• Otra páginas.
• La navegación de tu sitio.
• La URL directa de una subpágina.

Para añadirlo:

1. Copia el slug de tu Página de Índice desde su configuración de página.
2. Vuelve a abrir el editor del enlace.
3. Añade el slug de la página antes del enlace ancla entre dos símbolos /, así:

https://examplesite.com/indexslug/#pageslug

4. Haz clic en Guardar.

Nota: Si tu dominio principal incluye www antes de tu nombre de dominio, incluye eso también en la URL del enlace ancla.

Ejemplos

Agrega enlaces ancla a varias secciones para permitir que los visitantes naveguen en tu Página de Índice. Este ejemplo usa la plantilla Brine y tres diferentes tipos de enlaces: Bloque de botón, enlace de texto y URL clickthrough de imágenes.

Crea una navegación acomodando tus enlaces ancla lado a lado. Este ejemplo usa la plantilla Bedford y enlaces de texto.

Página de índice de cuadrícula y enlaces ancla

Estas familias de plantillas con Páginas de Índice en cuadrícula tienen una funcionalidad similar:

• Avenue
• Flatiron
• Montauk

Puedes crear un enlace ancla a la Página de Índice en estas plantillas con el siguiente formato de URL:

/index-page-slug/#/page-slug

Esta es una buena opción para agregar hipervínculos a páginas dentro del índice desde la navegación de tu sitio o desde otras páginas de tu sitio. La página se abre con cualquier formato específico del Índice, del mismo modo que se abriría si hicieras clic en su imagen destacada en el índice.

Este ejemplo usa la plantilla Avenue.

Solución de problemas

Si un enlace ancla no funciona, estos consejos pueden ser útiles:

• Si es necesario, verifica haber agregado el slug de la página de índice según lo descrito en el paso 4, incluidos los dos símbolos /. Esto es necesario para los enlaces de navegación y los enlaces de otras páginas.
• Si tienes problemas en los sitios móviles y tu planilla pertenece a la familia Brine, prueba deshabilitar Ajax transitoriamente para ver si esto está causando el problema.
• Verifica que el slug de la página de índice y el slug de la página de la sección sean correctos. Si cambiaste alguno de ellos, deberás actualizar el enlace ancla manualmente.