Cómo insertar hipervínculos de anclaje de WordPress en WordPress (3 técnicas)

Publicado: 2022-04-26

Muchas de las decisiones de diseño que tomará en todo su sitio web hacen referencia a la usabilidad y la experiencia del consumidor (UX). Además, el contenido del sitio web (en general, mirar a través de las páginas web de su sitio) tiene mucho precio. Si se casa con cada uno de estos, a menudo pensará en formas de respaldar la UX de su información. Los vínculos de retroceso de anclaje de WordPress son un elemento básico para la experiencia de usuario de su contenido.

Piense en los enlaces unidireccionales anclados como navegación en línea para el artículo en cuestión. Puede verlos en todas partes, pero los encabezados son un caso de uso generalizado. Esto permite que un lector salte cerca de una publicación si lo desea sin la necesidad de perderse. Es un aspecto de UX de primer nivel a tener en cuenta, y algo que la mayoría de los propietarios de sitios web deberían considerar.

Para demostrarle lo fácil que es usarlos, este artículo aparecerá en los enlaces de anclaje de WordPress. Antes de entrar en las diversas técnicas que puede incorporar, hablemos sobre qué son y qué pueden hacer por usted.

Qué es una conexión de anclaje

En un sentido típico, una conexión de anclaje es una pieza de navegación en línea en la que se puede hacer clic. Es diferente a una pieza de contenido y lo llevará a un nivel posterior en la página web. Los usamos en WPKube para ayudarlo a saltar a las distintas acciones en los tutoriales:

Un enlace ancla de WordPress en una publicación de WPKube.

Si simplemente hace clic en la URL, el sitio saltará a la parte relacionada que especifique. Es una implementación muy simple que puede tener efectos fantásticos en la usabilidad de su sitio web. Hablaremos de algunas de estas circunstancias a continuación.

Por qué querrías usar enlaces unidireccionales de anclaje en WordPress

Mencionamos la usabilidad como un motivador esencial para utilizar los vínculos de retroceso de anclaje de WordPress, y esta es una razón clave sólida para emplearlos. Por otro lado, hay muchos escenarios de uso para agregarlos a su sitio web. Por ejemplo:

  • Si desea proporcionar contenido escrito muy extenso a sus lectores (como publicaciones de 3,000 términos), a menudo tendrá una tabla de contenido. Este es un uso hecho a la medida para anclar enlaces entrantes.
  • Las anclas también pueden funcionar cuando comparte publicaciones de marcadores. Si contiene un ancla dentro de la URL, un lector saltará directamente al escenario que desea que vea.
  • Su búsqueda de optimización de motores (optimización de motores de búsqueda) puede mejorar, principalmente porque en algunas condiciones, los motores de búsqueda mostrarán los enlaces unidireccionales de anclaje de WordPress como entradas diferentes.

En pocas palabras, si desea que su audiencia se mantenga cerca de su sitio y tenga interacción con sus artículos, los enlaces entrantes de anclaje de WordPress son un arma crítica en la lucha por el tráfico. En cuanto a cómo agregarlos a su sitio web, el número futuro de secciones le mostrará.

Cómo incluir vínculos de retroceso de anclaje a cualquier código HTML

La base para incluir hipervínculos de anclaje de WordPress está en HTML. De hecho, puede usarlos en cualquier sitio web, no solo dentro de WordPress. Hay dos partes: el ancla y la etiqueta.

Primero, aumentará el vínculo de retroceso del ancla como lo haría con cualquier otro hipervínculo, utilizando etiquetas. Solo para la conexión, utilizará un 'octothorpe' (también conocido como señal hash o libra) justo antes:

Click on further more down the web page

Habiendo dicho eso, si hace clic en esto, la URL no irá a ninguna parte. Para que vaya a alguna parte , incorporará el mismo hipervínculo href como una id más adelante en los artículos, sin la necesidad del octothorpe:

Nuestro encabezado anclado

Esto vinculará ambas etiquetas juntas y creará la navegación en línea que debe tener. Tenga en cuenta que usamos una etiqueta de encabezado en este artículo, pero puede ser cualquier etiqueta HTML. Le invitamos a utilizar etiquetas de párrafo, etiquetas de imagen o cualquier otro aspecto de su HTML si eso hará que los clientes lleguen a donde deben estar.

Cómo agregar enlaces de anclaje de WordPress (3 métodos)

¡Vamos a mostrarle un caso serio en cuanto a los vínculos de retroceso de anclaje de WordPress ahora mismo! Esto es lo que probablemente trataremos en las próximas secciones:

  • Puede incluir anclajes a las funciones del Editor de bloques e ID establecidos en otros componentes. Esto también es posible en el Editor clásico.
  • Los creadores de sitios como Elementor proporcionarán un módulo que le permitirá insertar enlaces unidireccionales de anclaje de WordPress al contenido.
  • Hay complementos que pueden aumentar los hipervínculos de anclaje automatizados a su contenido, lo que puede ayudarlo a ahorrar tiempo de configuración.

Inicialmente apagado, vamos a mirar el método de guía. Aunque parezca difícil, aplicar el Editor de bloques lo hace muy simple.

1. Use una técnica de guía para insertar enlaces entrantes de anclaje al editor de bloques

Para la mayoría de los usuarios finales, el Editor de bloques ofrece todo lo que necesitará para aumentar los enlaces entrantes de anclaje de WordPress a su información. Para comenzar, destaque un fragmento de texto al que desee agregar un enlace de sitio web, como lo haría con un hipervínculo:

Elegir texto en la página para usar como hipervínculo.

A continuación, cambie esto a un enlace de sitio web utilizando la opción correspondiente e inserte su etiqueta de anclaje, precedida de un octothorpe:

Agregar un enlace de anclaje al texto, usando un octothorpe.

Sabrás si lo haces bien, porque verás la palabra "Interno" junto al vínculo de retroceso. Una vez que conserves esto, dirígete a la sección de tu contenido escrito en la que te gustaría establecer el ancla. Estamos encabezando para usar un encabezado.

Querrá dirigirse a la parte Bloque > Altamente desarrollada en la barra lateral de la mano ideal y hacerla crecer. Allí, verá la disciplina de anclaje HTML :

Agregar una ID al campo de anclaje HTML dentro del Editor de bloques.

Aquí, agregue el texto de su URL de anclaje de WordPress, sin el octothorpe. Esto es todo lo que necesita hacer, y si revisa la vista previa en vivo, verá que el enlace del sitio web ancla funciona.

Agregue enlaces de Anchor Back al Editor Vintage

El método para el Editor típico es una especie de híbrido entre la solución HTML totalmente manual y la del Editor de bloques. Primero, va a insertar el hipervínculo a su material solo en la página Visible...

Agregar un ancla HTML al texto dentro del Editor clásico.

… luego cambiará al editor de contenido textual y agregará el ancla a su factor ideal:

Uso del editor de texto para agregar un ID de enlace de anclaje.

Cuando vuelvas a cambiar al editor Visible, verás el vínculo de retroceso en su lugar, pero es posible que no funcione como esperabas hasta que obtengas una vista previa de tu artículo.

2. Insertar enlaces de Anchor Back haciendo uso de un complemento de Site Builder

La mayoría de los complementos de creación de páginas, como Elementor o Beaver Builder, ofrecen módulos para incluir enlaces de anclaje en su contenido. Estos pueden ser tan versátiles como HTML, principalmente porque pueden ir a cualquier lugar donde puedan ir otros módulos.

Por ejemplo, en Elementor, vas a utilizar el elemento Anclaje de menú:

Elemento ancla del menú de Elementor.

Para usar esto, arrástrelo a su posición elegida. Le sugerimos que lo ubique antes de cualquier aspecto del rumbo o, como mínimo, antes del área que necesitará anclar.

Agregar una identificación al ancla del menú dentro de Elementor.

Cuando lo ayude a guardar sus variaciones, puede examinar la URL de anclaje. Los creadores de sitios únicos utilizan una variedad de enfoques para insertar hipervínculos de anclaje de WordPress, y también encontrará diferentes implementaciones en la interfaz. Sin embargo, el concepto es el mismo, y también obtendrá los beneficios finales exactos.

3. Use un complemento para incorporar enlaces automáticos de anclaje a su sitio

Si desea insertar mucho más rendimiento en su página web y ayudar a que sus backlinks de anclaje de WordPress brillen, puede usar un complemento de tabla de contenido (ToC). Hay varios accesibles, pero la mayoría no tienen evaluaciones de las últimas versiones de WordPress, o nunca tienen actualizaciones frecuentes. Aun así, el complemento SimpleTOC marca todos los contenedores apropiados:

El complemento SimpleTOC.

Por supuesto, deberá configurar y activar el complemento de la manera habitual y luego dirigirse al Editor de bloques. A continuación, guarde sus artículos y busque el bloque SimpleTOC:

Encontrar el bloque SimpleTOC dentro de WordPress.

Después de agregar esto a su publicación, capturará inmediatamente los enlaces de cualquier título en sus artículos. El ToC mostrará encabezados individuales y no tendrá que realizar ningún etiquetado de guía.

La generación del complemento SimpleTOC de una tabla de contenido.

Aun así, puede limitar algunos encabezados de su ToC si lo desea. Si aumenta el curso de CSS simpletoc-concealed la industria de Clases adicionales de CSS de un Bloque de encabezado, esto lo ocultará de su TdC. Puede encontrar esta disciplina en el mismo lugar que la disciplina de anclaje HTML: en la barra lateral Bloque > Innovador :

El campo Clases CSS adicionales dentro del Editor de bloques.

Es una implementación muy simple que puede no tener el grado exacto de flexibilidad general como los procedimientos manuales, pero es rápido y le permite usar los enlaces de anclaje de WordPress de manera normal sin tener mucha energía.

En resumen

La experiencia del usuario es primordial y, como tal, querrá pensar en todas las formas en que puede hacer que su tiempo en el sitio web sea un problema. Los enlaces entrantes de anclaje de WordPress pueden lograr esto. Lo ayudan a crear una navegación de contenido en línea y, a su vez, esto ayudará a sus compradores a desplazarse al contenido escrito que necesitan sin tener que preocuparse ni demorarse.

Esta publicación ha aparecido en algunas estrategias para incorporar enlaces de anclaje de WordPress a su sitio. Aquí hay un resumen rápido:

  • Puede incorporarlos como parte de las etiquetas HTML en cualquier sitio web, no solo en WordPress.
  • El Editor de bloques le permite incorporar anclas de la misma manera que aumentaría los hipervínculos.
  • Los creadores de sitios web como Elementor normalmente tienen módulos enfocados que le permiten incorporar anclas a su material.
  • Un complemento como SimpleTOC puede incorporar enlaces automáticos de anclaje de WordPress a su contenido. En algunos casos, un complemento actualizará su tabla de contenido para que coincida con los encabezados de su publicación.

¿Siente que los enlaces de anclaje de WordPress brindan beneficios a su SEO y a sus espectadores, y si no, qué los ayuda a participar? ¡Háganos saber en la sección de respuestas a continuación!