Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.
Añadir Enlaces ancla a la Página de Índice

Los enlaces ancla ("saltos de página") son URL especiales que te llevan a lugares específicos dentro de una página. Las páginas de índice apiladas tienen una estructura especial de URL que puedes usar para crear enlaces ancla sin código personalizado.

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

Nota: Para agregar enlaces ancla a otras páginas y plantillas con código personalizado, consulta 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 añadir -sección 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 añadir 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 quieres enlazar. Haz clic en el icono del engranaje para abrir la Configuración de página para 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 visitantes navegan a esa sección. Puedes cambiar el slug escribiendo el texto nuevo en este campo.

Adding_Index_Page_anchor_links.png

Paso 2 - Crea el enlace

Agrega el vínculo en el que harán clic los que visitan el sitio. Puedes usar cualquier tipo de enlace, pero estos pasos usan un vínculo de texto como ejemplo. En el 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, BrinePacific.

Paso 3 - Agrega el slug de página

A continuación, sigue estos pasos:

  1. En la casilla Enlace, pega el slug que copiaste en el paso 1.
  2. Añade 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 el icono del engranaje para abrir la configuración y comprobar que Abrir en una ventana nueva esté desactivado.
  4. Para las plantillas Pacific, Charlotte, Fulton, Horizon y Naomi, agrega -section al final del enlace ancla, así: #hours-and-location-section.
  5. Haz clic en Guardar.

Paso 4: Añade el slug del Índice

Si agregaste tu enlace del paso 2 a una sección dentro del mismo índice, puedes omitir este paso.

Para cualquier otro enlace, incluye el slug de la Página de Índice antes del enlace ancla. Esto garantizará que tus enlaces funcionen desde estas opciones:

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

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
  1. Haz clic en Guardar.

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.

Ejemplos de enlaces ancla en la plantilla Brine con un Bloque de botón, un vínculo de texto y una URL clickthrough de imagen.

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

Ejemplos de enlaces ancla en la plantilla Bedford colocados a la par.

Páginas de Índice en 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 vincular 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 miniatura, en el Índice.

Este ejemplo usa la plantilla Avenue.

Ejemplo del comportamiento de un enlace ancla en una Página de Índice en grilla.

Resolución de problemas

Si un enlace de anclaje 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 /. Es obligatorio que lo hagas para los enlaces de navegación, los enlaces de otras páginas y en Internet Explorer.
  • 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.
¿Fue útil este artículo?
Usuarios a los que les pareció útil: 39 de 113
Añadir Enlaces ancla a la Página de Índice