WordPress enlace personalizado target _blank

09/09/2022

WordPress enlace personalizado target _blank
Índice
  1. Javascript añade target=_blank'' a todos los enlaces
    1. WordPress html abrir enlace en ventana nueva
    2. Wp_nav_menu
    3. Wp_nav_menu_objetos

Javascript añade target=_blank'' a todos los enlaces

Recientemente surgió un ticket solicitando que la casilla target _blank en el diálogo de enlaces de WordPress esté marcada por defecto. Tenemos muchos enlaces a sitios externos, así que tiene mucho sentido. No hay problema, pensé. WordPress tiene que tener un gancho fácil o dos que puedo utilizar. Bueno, después de buscar en Google encontré un montón de métodos, ninguno de los cuales parecía funcionar. Así que, de mala gana, me puse a investigar.

Al indagar en TinyMCE vemos que en la versión 4.4.3 hay un atributo default_link_target que se puede pasar a la configuración para conseguir exactamente lo que queremos. Desgraciadamente esto no funciona por una de estas dos razones, o bien porque WordPress utiliza actualmente TinyMCE 4.4.1 o bien porque WordPress utiliza un cuadro de diálogo de enlaces personalizado que no tiene en cuenta todas las opciones de TinyMCE. No me molesté en investigar cuál era.

El código comprueba si se ha introducido una URL para el enlace y, si no es así, comprueba automáticamente la casilla de verificación de destino _blank. Si se ha introducido una URL no hace nada. Agregue este código a su archivo functions.php y luego en las pantallas de publicación nueva y de edición de publicaciones la casilla de verificación de destino en blanco se marcará por defecto para todos los enlaces nuevos.

WordPress html abrir enlace en ventana nueva

En esta guía para principiantes, mostraremos cómo abrir fácilmente enlaces externos en una nueva ventana en su sitio de WordPress. También mostraremos diferentes métodos para hacerlo, para que puedas elegir el que más te convenga.

Otro beneficio de abrir enlaces externos en una nueva ventana es el aumento de las visitas a la página y el compromiso de los usuarios en su sitio. Es más probable que los usuarios vuelvan a la pestaña anterior y terminen de leer el artículo.

Sólo tienes que editar una entrada del blog o una página en la que quieras añadir un enlace externo. A continuación, selecciona el texto que quieres enlazar y haz clic en el botón de insertar enlace (o pulsa CTRL + K en Windows / Comando + K en Mac).

Desde aquí, puedes añadir el enlace y marcar la casilla junto a la opción "Abrir enlace en una nueva pestaña". A continuación, haga clic en el botón Añadir enlace y la ventana emergente desaparecerá. Ahora verás el código HTML del enlace en el editor de texto.

Esperamos que este artículo le haya ayudado a aprender cómo abrir fácilmente enlaces externos en una nueva ventana en WordPress. Quizás también quieras ver nuestra lista definitiva de los consejos, trucos y hacks más útiles de WordPress que puedes utilizar en tu sitio web.

Para aquellos que aún no se han dado cuenta, WordPress ahora añade atributos rel="noopener" para cualquier enlace externo añadido a través del Quicktag de enlace en el Visual/RTE. Así que si activa la opción "Abrir enlace en una nueva pestaña", WordPress añadirá automáticamente el atributo rel noopener al enlace. Esto es para protegerse contra CORS y otros exploits que se aprovechan de los enlaces con objetivos en blanco. Es un movimiento inteligente que puede escapar a muchos en la comunidad de WordPress. Así que en un esfuerzo por ayudar a fomentar la comprensión, este post explica cómo funciona y por qué es beneficioso, y luego explica algunas maneras de solucionar, mejorar, desactivar, etc.

La mejor manera de entender cómo funciona, es probarlo usted mismo. Hay dos maneras de llegar al cuadro de diálogo Insertar Enlace: a través del Editor RTE/Visual, o a través del Editor de Texto Simple. Aquí están los pasos para el editor de texto plano (puede seguir pasos similares para llegar a través del RTE/Editor Visual):

Puede ver un ejemplo de la ventana de diálogo en la captura de pantalla de arriba. Después de añadir el enlace al contenido de la entrada, observará que WordPress añade tanto target="_blank" como rel="noopener" al marcado del enlace. Aquí hay un ejemplo del HTML generado:

Estoy usando el filtro post_link para cambiar la url en sí cuando sea necesario, pero necesitaría poder modificar la parte html también. No puedo encontrar el filtro correcto, me encontré con un filtro "edit_post_link", pero eso no hizo el truco ya que parece que está trabajando sólo en el back-end.

Si usas el filtro "the_content" puedes usar una combinación de sentencias preg_... para recorrer todos los enlaces, añadiendo target="_blank" a los que cumplan tus requisitos específicos. Puedes añadir este filtro a tu functions.php, o a la selección de plantillas de páginas, entradas o categorías.

Subir
Esta web utiliza cookies propias para su correcto funcionamiento. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
Privacidad