Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.
Adding Index Page anchor links

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.

For example, when you click the “View Our Work” button on the Hayden template's demo site, it scrolls down the page to the "Moreau" section.

Note: To add anchor links on other pages and templates with custom code, visit Creating anchor links

Supported templates

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.
Tip: Some grid Indexes support a similar functionality. You can also use custom code to add regular anchor links on any template.

Step 1 - Find the 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.

Copy the slug from the URL Slug field. You'll use this slug to create an anchor link.

Tip: The slug may display in the browser bar when visitors navigate to that section. You can change the slug by typing new text in this field.

Campo de Slug de la URL en Configuración de página.

Step 2 - Create the link

Agrega el vínculo en el que harán clic los visitantes. Puedes usar cualquier tipo de vínculo, pero este ejemplo muestra un vínculo de texto. En el Bloque de Texto, resalta el texto y haz clic en el ícono del vínculo 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.

Para crear el enlace, destaca el texto y haz clic en el icono de enlace.

Step 3 - Add the page slug

Next, follow these steps:

  1. In the External tab, paste the slug you copied in Step 1.
  2. Add a hashtag symbol (#) to the front of the slug to complete the link. The anchor link in this example is #hours-and-location.
  3. Ensure Open in New Window is unchecked.
  4. For the Pacific, Charlotte, Fulton, Horizon, and Naomi templates only, add -section to the end of your anchor link, like this: #page-slug-section
  5. Haz clic en Agregar Vínculo y, luego, en Guardar.

Formato del enlace ancla de la Página de Índice que debe usarse cuando el enlace aparece en la Página de Índice.

Step 4 - Add the Index slug

If you added your link in Step 2 to a section within the same Index, you can skip this step.

For any other link, include the Index Page's slug before the anchor link. This will ensure your links work from:

  • A different page.
  • Your site's navigation.
  • A subpage's direct URL.
  • Internet Explorer.

To add this:

  1. Copy the slug for your Index Page from its Page Settings.
  2. Re-open the link editor.
  3. Add the page slug before the anchor link between two / symbols, like this:
/indexslug/#pageslug

Formato del enlace ancla de la Página de Índice que debe usarse cuando el enlace aparece en otra página o en la navegación.

Step 5 - Save

Haz clic en Actualizar en el editor de vínculos y, luego, en Guardar. El vínculo que has establecido en el Paso 2 ahora llevará a los visitantes a la sección que elegiste en el Paso 1.

Hacer clic en el enlace te dirige a la sección seleccionada.

Examples

Add anchor links to multiple sections to help visitors navigate around your Index Page. This example uses the Brine template and three different link types: Button Block, text link, and image clickthrough URL.

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.

Create a navigation by arranging anchor links side by side. This example uses the Bedford template and text links. 

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

Grid Index Pages and anchor links

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

If an anchor link isn't working, these tips may help:

  • Ensure you added the Index Page slug as described in Step 4, including the two / symbols. This is especially important for navigation links, links from other pages, and in Internet Explorer.
  • If you're seeing issues on mobile and your template is in the Brine family, try temporarily disabling Ajax to see if that's causing the issue.
  • Ensure the Index Page slug and section's page slug are accurate. If you changed either of these, you'll need to update the anchor link manually.
¿Fue útil este artículo?
Usuarios a los que les pareció útil: 37 de 104
Adding Index Page anchor links