Cómo crear y añadir enlaces de anclaje en WordPress: Guía detallada

Los enlaces de anclaje, también conocidos como enlaces de salto o enlaces de omisión, mejoran la navegación y la experiencia del usuario en páginas y entradas de WordPress más largas o con mucho texto al reducir el desplazamiento. Permiten a los usuarios saltar rápidamente a secciones específicas de contenido en la misma página haciendo clic en un enlace.

En esta guía, repasaremos todos los pasos y consideraciones para añadir enlaces de anclaje en WordPress, incluyendoEditor clásico, editor Gutenberg y constructor de páginas WPBakery.El método de aplicación en el

¿Qué es un enlace de anclaje?

Los enlaces de anclaje son unhipervínculo, enlaceNo le llevará a una página nueva, sino que saltará a una parte específica de la misma página. Por ejemplo, si está leyendo un artículo largo y hay un índice en la parte superior, puede hacer clic en el enlace para ir directamente a la sección que le interese.

Normalmente, los anclajes se añaden a elementos de texto como encabezados o párrafos, pero también pueden añadirse a elementos de menú, botones, imágenes o formularios.

¿Por qué utilizar enlaces de anclaje?

El uso de enlaces de anclaje mejora la experiencia de usuario de su sitio web, ya que permite a los usuarios encontrar rápidamente lo que buscan sin tener que desplazarse interminablemente, y también facilita la accesibilidad web. Los enlaces de anclaje ayudan a los motores de búsqueda como Google a comprender mejor la estructura de su página, lo que a su vez mejora la clasificación de su sitio web.

Estructura de los enlaces de anclaje

Para entender los enlaces de anclaje, vamos a desglosar su estructura. Los enlaces de anclaje constan de dos partes principales:

1. ID (identificador)

Es el identificador único que se añade al elemento al que se quiere enlazar. En HTML, puede añadir un ID a un elemento de la siguiente manera:

<code><h2 id="section1">sección1</h2>

Toma.id="sección1" es el identificador único.

2. Enlaces

Esta es la sección sobre la que se puede hacer clic y que salta a la ID que ha creado. utilice el número de pozo (#) seguido de la ID. por ejemplo:

<code><a href="#section1">Ir a la Parte 1</a>

href="#section1" section indica al navegador que salte al elemento con el ID "section1" al hacer clic en el enlace.

Cómo crear enlaces de anclaje en WordPress

Uso del editor clásico de WordPress

En primer lugar, presentaremos el método para añadir enlaces de anclaje en el editor clásico de TinyMCE, que es la forma clásica de editar entradas y páginas en WordPress.

1, añadir un ID único para el elemento

1. Abra la entrada o página a la que desea añadir un enlace de anclaje.
2. Cambia del modo visual al modo texto para editar directamente HTML.
3. Busque la sección de contenido a la que desea adjuntar un ancla.
4. Añade un ID único al elemento, por ejemplo:

<code><h2 id="section1">Sección 1</h2>

Si desea añadir un ID para una palabra o frase específica en un párrafo, puede añadirlo así:

<code><p>Es un <a id="specificWord">palabra específica</a> Ejemplos de.</p>

2. Enlace al punto de anclaje

1. Vuelve a pasar del modo texto al modo visual.
2. Seleccione el texto que se utilizará como enlace y haga clic en "Insertar/editar enlaces".
3. En la ventana emergente, utilice el número de pocillo (#) seguido del ID que ha creado:

<code><a href="#section1">Ir a la sección 1</a>

Haga clic en "Añadir enlace", guarde los cambios y habrá terminado de crear enlaces de anclaje en el Editor clásico.

3. Añadir anclajes desde la barra de navegación

1. En el Centro de Información de WordPress, vaya a "estado exterior" y luego vaya a "menú".
2. En el editor de menús, haga clic en "Enlaces personalizados"Despliégalo.
3. Para añadir un enlace a la página de destino, añada el número de pozo (#) a su enlace junto con el ID del elemento:

<code><a href="#section1">Ir a la sección 1</a>

Guarde los cambios y vea los resultados.

Uso del editor Gutenberg

Lo siguiente es cómo crear enlaces de anclaje en el editor Gutenberg, que es el editor basado en bloques más nuevo de WordPress.

1, añadir un ID único para el elemento

1. Abra la entrada o página a la que desea añadir un enlace de anclaje.
2. Seleccione el bloque al que desea añadir un punto de anclaje.
3. En la configuración del bloque, desplácese hacia abajo y haga clic en "Editar en HTML".
4. Busque la sección de contenido a la que desea adjuntar el ancla y añada un ID único al elemento:

<code><h2 id="section1">Sección 1</h2>

Alternativamente, puede seleccionar el bloque yendo a la configuración del bloque de la derecha en el "alto nivel"e introduzca allí su punto de anclaje HTML único.

2. Enlace al punto de anclaje

1. Haga clic en "Edición visual" para volver al bloque de texto.
2. Seleccione el texto que se utilizará como enlace y haga clic en "Enlace" en la barra de herramientas.
3. En la ventana emergente, utilice el número de pocillo (#) seguido del ID que ha creado:

<code><a href="#section1">Ir a la Parte 1</a>

Prensa "Entre en", guarda los cambios y habrás terminado de añadir enlaces de anclaje a Gutenberg.

Creando Enlaces Ancla en el Constructor de Páginas WPBakery

Por último, vamos a explorar cómo añadir enlaces de anclaje en WPBakery Page Builder, que permite añadir anclajes a cualquier elemento de una página o entrada de WordPress.

1, añadir un ID único para el elemento

1. Seleccione y añada el elemento al que desea añadir el ancla (o lo que es lo mismo, el destino al que saltará el enlace).
2. Abre la ventana de edición del elemento.
3. Desplácese hasta la sección "ID de elemento" y añada su ID único:

sección 1

2. Enlace al punto de anclaje

1. Seleccione y añada el elemento al que se añadirá el enlace de anclaje (en otras palabras, el elemento que saltará al destino cuando se haga clic en él), por ejemplo "botones".
2. Abre la ventana de edición del elemento.
3. Vaya a la sección "URL (enlace)" y haga clic en "Seleccionar URL".
4. En la ventana emergente, utilice el número de pocillo (#) seguido del ID que ha creado:

<code><a href="#section1">Ir a la sección 1</a>

Haz clic en "Establecer enlace" para guardar los cambios y comprobar cómo funciona tu enlace de anclaje.

Buenas prácticas para los enlaces de anclaje

Estas son algunas de las mejores prácticas para utilizar enlaces de anclaje en WordPress:

1. Garantizar identificadores únicos

Cuando cree IDs de elementos, asegúrese de que son únicos en la página (o en el mismo documento HTML). Los ID duplicados pueden provocar un comportamiento de salto inesperado.

2. Evite utilizar caracteres especiales en los identificadores

Los ID de elementos no pueden contener espacios, signos de puntuación ni caracteres especiales, ni pueden empezar por un número o un guión (-). Aunque HTML lo permite, puede causar problemas en otros contextos, como CSS y JavaScript, por lo que es mejor evitarlo en la medida de lo posible.

3. El enlace empieza por "#" pero no contiene "#" en el ID.

Por ejemplo, el enlace debería ser "#section1" y el ID debería ser "section1". Este es un error común que puede hacer que los enlaces de anclaje no funcionen correctamente.

4. Evite utilizar enlaces de anclaje vacíos

Un enlace de anclaje simple es un enlace que utiliza la propia URL como ancla, por ejemplo https://example.com. Aunque pueden ser necesarios en algunos casos, carecen de contexto y no proporcionan el mismo texto de anclaje descriptivo que el Ventaja SEO.

5. Haz que el texto de anclaje sea claro y descriptivo

No utilice frases vagas como "más información", "haga clic aquí" o "continuar".En su lugar, utilice un texto más específico, como "Haga clic aquí para descargar el PDF del manual de usuario" o "Más información sobre nuestro equipo". Esto mejora la accesibilidad web y ayuda a los usuarios a entender adónde les llevará el enlace.

6. Compruebe que los enlaces de anclaje funcionan correctamente

Pruebe siempre los enlaces de anclaje para asegurarse de que funcionan correctamente. Los enlaces ineficaces pueden frustrar a los usuarios y perjudicar tu SEO.

¿Cuándo utilizar enlaces de anclaje? (Ejemplo)

Los enlaces de anclaje en WordPress son muy útiles en muchas situaciones. He aquí algunos ejemplos:

1. Catálogo

Si el artículo es largo, un índice con enlaces de anclaje en la parte superior puede ayudar a los lectores a saltar a la sección que desean leer.

2. Navegación de una sola página

En los sitios web de una página, los enlaces de anclaje ayudan a los usuarios a acceder rápidamente a distintas secciones, como "Acerca de", "Servicios" y "Contacto".

3. Llamada a la acción (CTA)

Utilice enlaces de anclaje para dirigir a los usuarios a realizar acciones específicas, como rellenar un formulario o ver un producto.

4. Contenidos largos

Divida el contenido largo en secciones con enlaces de anclaje para que los lectores puedan encontrar fácilmente la información que necesitan.

5. Volver al principio

Introducir un botón de "retroceso al principio" (normalmente situado en la esquina inferior derecha de un sitio web) puede ayudar a los usuarios a volver al principio y realizar una acción rápida.

Preguntas frecuentes

1. ¿Cuál es la diferencia entre un enlace de anclaje y un enlace normal?

Los enlaces de anclaje apuntan a una parte específica de la misma página, mientras que los enlaces normales suelen llevar a una página diferente.

2. ¿Pueden los enlaces de anclaje mejorar el SEO?

Sí, los enlaces de anclaje forman parte de una estrategia de enlaces internos que ayuda a los motores de búsqueda a comprender la estructura y la importancia del contenido de una página, mejorando así el SEO.

3. ¿Pueden los enlaces de anclaje mejorar la accesibilidad?

Sí, los enlaces de anclaje pueden ayudar a los usuarios (especialmente a los discapacitados) a navegar por contenidos largos de forma más eficiente, mejorando así la accesibilidad.

4. ¿Cómo puedo comprobar si mis enlaces de anclaje funcionan?

Los enlaces de anclaje pueden comprobarse haciendo clic en ellos para ver si llevan a la sección correcta. También se pueden utilizar las herramientas de desarrollo del navegador para comprobar si hay algún problema.

5. ¿Existe algún plugin que me ayude a añadir enlaces de anclaje en WordPress?

Sí, existen plugins que pueden ayudarte a crear y añadir enlaces de anclaje a cualquier elemento de tu diseño de WordPress, como por ejemplo Constructor de páginas WPBakery.

alcanzar un veredicto

Añadir enlaces de anclaje en WordPress puede mejorar enormemente la navegación, la experiencia de usuario, el SEO y la accesibilidad de tu sitio. Siguiendo los métodos descritos en esta guía, los enlaces de anclaje se pueden crear fácilmente en WordPress utilizando el editor clásico, el editor Gutenberg o el constructor de páginas WPBakery. Cada método tiene sus méritos, pero como se mencionó anteriormente, WPBakery se destaca por permitir agregar enlaces de anclaje a cualquier elemento de la página.

Contacte con nosotros
¿No puede leer el tutorial? Póngase en contacto con nosotros para obtener una respuesta gratuita. Ayuda gratuita para sitios personales y de pequeñas empresas	Servicio de atención al cliente WeChat
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) Correo electrónico: info@361sale.com
④ Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres