Un enlace ancla en WordPress es una herramienta útil para crear saltos dentro de una misma página, facilitando la navegación entre secciones específicas de un contenido extenso. Estos enlaces permiten que los usuarios se desplacen directamente a la parte del contenido que les interesa sin necesidad de hacer scroll manualmente. Usar anclas en WordPress es particularmente efectivo para mejorar la experiencia del usuario, especialmente en páginas largas como tutoriales o guías.
Índice
¿Por qué deberías usar enlaces ancla en WordPress?
Los enlaces ancla en WordPress son ideales para mejorar la usabilidad y la navegación de tus páginas web. Al crear saltos de enlace en una misma página en WordPress, facilitas que los usuarios encuentren rápidamente la información que buscan. Esto no solo mejora la experiencia del usuario, sino que también puede reducir la tasa de rebote y aumentar el tiempo de permanencia en tu sitio.
Cómo crear un enlace ancla en WordPress paso a paso
Paso 1: Asigna un ID a la sección de destino
Lo primero que debes hacer es asignar un identificador único (ID) a la sección a la que quieres que el enlace ancla lleve. Esto se hace editando el bloque o la sección en el editor de WordPress y añadiendo un ID personalizado.
Ejemplo de código HTML:
<h2 id="seccion1">Título de la Sección 1</h2>
Paso 2: Crea el enlace ancla
Una vez que has asignado un ID a la sección de destino, puedes crear un enlace que apunte a esa sección específica. Para hacerlo, simplemente agrega el símbolo # seguido del ID que has asignado en el paso anterior dentro del atributo href del enlace.
Ejemplo de código HTML:
<a href="#seccion1">Ir a la Sección 1</a>
Cómo poner un ancla en WordPress usando Gutenberg
El editor de bloques de WordPress, Gutenberg, facilita aún más la creación de anclas en WordPress, porque no requiere usar código HTML o tener conocimientos avanzados de desarrollo web. Sigue estos pasos para agregar anclas sin necesidad de tocar código:
1. Selecciona el bloque
- Selecciona el bloque al que deseas asignar un ancla.
- En la barra lateral derecha, desplázate hasta la opción Avanzado.
- En el campo HTML Anchor (Ancla HTML), escribe el ID que deseas asignar al bloque.
2. Enlaza el ancla a otro bloque
Ahora, simplemente enlaza a esta ancla desde cualquier parte de tu página o incluso desde otra página en tu sitio.
Ejemplo de ancla en un botón
- Si deseas crear el enlace ancla con un botón, deberás seleccionar el bloque del botón.
- Dirígete a General, luego a Contenido.
- En la casilla Link, escribe el ID que le asignaste al enlace ancla, acompañado del signo de número (#).
Ejemplo de saltos de enlace en una misma página en WordPress
Colocar saltos de enlace en una misma página en WordPress es un proceso sencillo, para lograrlo sigue estos pasos:
- Sigue el paso 1, Selecciona el bloque de este artículo.
- Copia el ID que le asignaste al enlace ancla.
- Selecciona el texto donde colocaras tu enlace ancla.
- En la barra de menú que se desplegara, selecciona la opción de enlace.
- Pega el ID del enlace ancla, precedido del signo de número (#).
- Presiona Enter o el símbolo de Enviar del lado derecho de la casilla.
- Te recomiendo resaltar el texto ancla con un color distintos, para que los visitantes de tu página sepan que ahí hay un enlace.
Ejemplo de anclas en WordPress entre distintos artículos o páginas
Para casos en los que necesites conectar secciones de un artículo, en un artículo diferente, puedes usar una ancla en entre los artículos o páginas de tu web. Sigue estos pasos:
- Copia el enlace del artículo donde está el enlace ancla; www.ejemplo.com/nombre-de-tu-articulo/
- Copia el ID del bloque al cual le asignaste el ancla, y pégalo al lado del enlace de tu artículo; www.ejemplo.com/nombre-de-tu-articulo/#enlace-ancla
- Ve al artículo donde colocaras el ancla, selecciona el texto, bloque, imagen, botón o sección de tu preferencia, y pega el enlace que creaste.
Ejemplo de enlace con ancla añadida:
www.ejemplo.com/nombre-de-tu-articulo/#enlace-ancla
Los saltos de página también puede colocarse en el menú de navegación de tu web, con la finalidad de conectar secciones específicas de artículo o página y facilitarle la navegación a los usuarios: Sigue estos sencillos pasos para lograrlo:
- Copia el enlace del artículo donde está el enlace ancla; www.ejemplo.com/nombre-de-tu-articulo/
- Copia el ID del bloque al cual le asignaste el ancla, y pégalo al lado del enlace de tu artículo; www.ejemplo.com/nombre-de-tu-articulo/#enlace-ancla
- Ve al menú lateral izquierdo y haz clic en Apariencia, luego en Menús.
- Selecciona el menú de tu preferencia y haz clic en Enlaces personalizaos.
- En URL, pega el enlace que creaste y que contiene el ancla.
- En Texto del enlace, asígnale un nombre, y añádelo al menú, presionando el botón Añadir al menú.
- Presiona el botón Guardar menú, para guardas los cambios.
Preguntas frecuentes
Imagen: Pixabay
Más tutoriales en arielbmtutoriales.com