[Manual de WP] Cómo agregar enlaces HTML en páginas y entradas de WordPress

Agregar enlaces HTML está a la orden del día en cualquier web o blog por los múltiples usos que tienen: permiten a los usuarios navegar por tu web fácilmente, facilitan la descarga de archivos y la visualización de imágenes y sirven para enlazar con otras páginas (ya sean de tu sitio o externas).

Una web sin enlaces es como un jardín sin flores. Por eso, conviene que sepas cómo agregar enlaces HTML para sacarles el máximo provecho.

Por cierto, los enlaces HTML se diferencian del resto del texto porque suelen aparecer subrayados o de un color diferente, aunque la forma en la que se muestran dependerá del tema que estés utilizando.

Dicho esto, vamos a ver cómo agregar enlaces HTML en tus textos en un santiamén.

Agregar enlaces HTML en WordPress

Insertar un enlace HTML en una página o entrada para que se vincule con otra página propia o a sitios externos es muy fácil.

Simplemente, selecciona el texto que quieras convertir en un enlace y haz clic en el botón «Insertar/Editar enlace». Se mostrará una pequeña barra de herramientas de enlace alineada, donde podrás introducir la URL del enlace.

Si escribes una URL sin incluir “http://” como prefijo, WordPress la corregirá automáticamente. Como ejemplo, si introduces “google.com”, se reemplazará por “http://google.com”.

Después de introducir la URL del enlace, presiona la tecla Enter de tu teclado o haz clic en el botón «Aplicar» para guardar los cambios.

En caso de que no selecciones ningún texto antes de hacer clic en el botón «Insertar/Editar enlace», se usará la URL que escribiste como texto del enlace.

También puedes agregar enlaces HTML tan solo escribiendo el nombre de la página o entrada y luego seleccionándola de la lista que se muestra.

Cuando escribas el nombre de la página o entrada, la lista se volverá a llenar, de acuerdo con los resultados que coincidan.

agregar enlaces html en wordpress

Si deseas que aparezca la ventana emergente, haz clic en el icono «Opciones de enlace» (una rueda de justes que aparece al seleccionar el icono de enlace). Esta ventana emergente te resultará útil para definir si quieres que el enlace se abra en una ventana o pestaña nueva.

agregar enlaces html en wordpress ventana emergente

Una vez que estás en la ventana emergente, solo tienes que introducir la URL y el texto del enlace, y luego hacer clic en el botón «Añadir enlace».

Te explico qué es cada cosa de esta ventana:

  • URL: la URL de la página o sitio hacia el cual vas a enlazar.
  • Enlace de texto: el texto sobre el que se va a crear el enlace. Es lo que se llama «anchor text» o texto ancla.
  • Abrir enlace en una pestaña nueva: cuando alguien hace clic en el enlace, este puede abrirse en la misma ventana (opción por defecto) o en una nueva ventana/pestaña del navegador.

Como alternativa, si quieres agregar un enlace a una entrada o página, selecciona de la lista la página o entrada que corresponda.

Estoy aprendiendo a dominar los enlaces en WordPress con este manual Clic para tuitear

Si cuentas con un gran número de páginas o artículos (como puede ser mi caso), puedes escribir el nombre de la página o entrada en el campo «Buscar» para localizarla fácilmente. En función de las coincidencias de búsqueda, la lista se autocompletará y mostrará diversos resultados. Cuando hayas elegido el destino de tu enlace, este se actualizará en el campo URL.

Ahora, pincha en «Añadir enlace» para agregar el enlace HTML.

Insertar enlaces a archivos multimedia

Agregar enlaces HTML a archivos multimedia, como documentos PDF, es tan fácil como agregar enlaces HTML comunes.

Veamos las 2 formas de proceder.

Haz clic en el botón «Añadir objeto» y arrastra el archivo desde la ubicación en tu ordenador hacia la ventana del navegador. El archivo se subirá automáticamente.

Como alternativa, una vez dentro de «Añadir objeto», haz clic en el botón «Selecciona archivos» y elige el archivo que quieres subir, usando el cuadro de diálogo que aparece.

Cuando el archivo se ha subido, se mostrará la Biblioteca multimedia, que contiene todos los archivos subidos previamente. El archivo que acabas de subir estará automáticamente seleccionado por si lo quieres insertar en ese momento en tu página o entrada.

agregar enlaces html en archivos multimedia en wordpress

Ahora solo tienes que actualizar el título del archivo en el campo «Título».

El título se usará como texto del enlace cuando se inserte en el contenido. A continuación, en la lista desplegable llamada «Enlazado a», selecciona «Archivo multimedia». El campo de abajo se completará de forma automática con la URL del archivo.

Haz clic en el botón «Insertar en la entrada» para insertar en tu artículo el enlace al archivo seleccionado. Ten en cuenta que cuando edites una página, este botón se llamará «Insertar en la página».

Como ves, WordPress te lo pone fácil para que no te pierdas en ningún momento. 😉

Si conoces la URL del archivo multimedia al que quieres enlazar, o si quieres crear un enlace de un texto existente, haz clic y arrastra el cursor para seleccionar el texto que deseas convertir en enlace y luego pincha en el botón «Insertar/editar enlace».

Al igual que la anterior opción, al agregar un enlace HTML simple, introduce la URL al archivo multimedia y a continuación haz clic en el botón «Añadir enlace». De este modo, se creará un enlace HTML estándar que apunte al archivo multimedia especificado.

Editar un enlace HTML

Ya sabes cómo agregar enlaces HTML, pero ¿y si quieres editarlo?

Te cuento paso a paso cómo hacerlo.

Para editar un enlace HTML haz clic sobre el enlace dentro de la entrada o página que quieres modificar. Verás que aparece la barra de herramientas alineada.

Descubre cómo añadir, editar y eliminar enlaces en WordPress Clic para tuitear

Pues bien, una vez que aparezca esta barra, haz clic en el botón «Editar» para mostrar el campo editar. Como alternativa, pincha en el enlace para posicionar el ratón en alguna parte del mismo y luego haga clic en el botón «Insertar/Editar enlace» de la barra de herramientas principal del editor.

Editar enlaces html en wordpress

Cuando hayas actualizado la URL del enlace, pulsa Enter o haz clic en el botón «Aplicar» para guardar los cambios. De nuevo, si prefieres mostrar la ventana emergente de «Insertar/Editar enlace», pincha en el icono «Opciones de enlace».

editar enlaces html en ventana emergente en wordpress

Eliminar un enlace HTML

Para eliminar un enlace HTML, solo hay que hacer clic sobre el enlace que queremos borrar y aparecerá una barra de herramientas en línea.

Una vez que aparezca esta barra, pincha en el botón «Eliminar» para borrar el enlace. Como alternativa, también puedes hacer clic en el enlace y pinchar en «Borrar enlace» de la barra de herramientas principal del editor visual.

Si quieres eliminar el enlace de una imagen, simplemente haz clic en la imagen para seleccionarla y luego pincha en el botón «Borrar enlace» de la barra de herramientas principal del editor.

Si el enlace HTML está vinculado a un archivo o imagen de tu biblioteca, al hacer clic en el botón «Borrar enlace» no eliminarás el archivo; solo quitarás el hipervínculo.

Eliminar enlaces en wordpress

Siguiendo estos pasos, habrás aprendido a agregar enlaces HTML en páginas o entradas de tu blog. Una vez que aprendes los pasos es bastante sencillo, ¿verdad?

Pues ahora, cuéntame, ¿te ha resultado útil este post para aprender a insertar hipervínculos? ¿Te ha quedado alguna duda? Te espero en los comentarios con la capa de sherpa tecnológico para ayudarte en lo que necesites.

Descubre lo que
necesitas ahora
para vender más

Realiza el Quiz ahora y conocerás el resultado al instante

¿Quieres saber qué herramientas uso en mi negocio, cuáles recomiendo a mis clientes y cuál necesitas tú ahora mismo, en el momento actual en el que te encuentras, para vender más o mejor en tu negocio digital?

Realiza ahora mismo el quiz tecnológico que he preparado, para determinar tu fase actual, y decirte en el instante en que deberías enfocarte ahora mismo para vender más o de la mejor forma posible

Mockup escritorio herramientas
Ir arriba