Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

¿Qué es rel=”noopener” en WordPress? (Explicado)

Estás añadiendo un enlace a tu contenido de WordPress y quieres que se abra en una nueva pestaña. Muy fácil. Pero, ¿te has fijado en el atributo rel="noopener" que WordPress añade automáticamente?

Según nuestra experiencia, este pequeño fragmento de código desempeña un papel crucial en la seguridad y la experiencia de usuario de su sitio web. Pero no afecta en absoluto al SEO.

Este artículo explicará el propósito del atributo rel="noopener", cómo afecta a su sitio WordPress y por qué es bueno tenerlo a mano.

What Is rel="noopener" in WordPress? (Explained)

¿Qué es rel=”noopener” en WordPress?

Cuando añada enlaces a su sitio web WordPress, puede utilizar atributos HTML para controlar lo que ocurre al enlazar el enlace.

Por ejemplo, al crear un enlace, hay un conmutador que permite abrirlo en una pestaña nueva.

Opening a Link in a New Tab

El código HTML generado por WordPress para este enlazar tiene este aspecto:

<a href="http://example.com" target="_blank" rel="noreferrer noopener">external link</a>

Observe que se han añadido algunos atributos HTML al enlace: rel="noopener" y rel="noreferrer". Estos atributos se han añadido para corregir un fallo de seguridad.

El problema es que el código JavaScript puede utilizarse para permitir que una nueva pestaña obtenga el control de su ventana de referencia. Si enlaza a un sitio web externo afectado por el código malicioso, entonces ese sitio web puede utilizar la propiedad window.opener en JavaScript para cambiar la página web original (en su sitio WordPress) para robar información y propagar código malicioso.

WordPress añade rel="noopener" para evitar que la nueva pestaña se aproveche de esta característica de JavaScript. Del mismo modo, el atributo rel=” noreferrer" impide pasar la información de referencia a la nueva pestaña.

¿Cómo afecta rel=”noopener” al SEO de WordPress?

No es así.

Aunque el atributo rel="noopener" mejora la seguridad de su sitio WordPress, algunos usuarios evitan utilizarlo porque piensan que afectará a su SEO en WordPress.

Pero eso no es más que un mito.

No tiene ningún impacto en la clasificación SEO de su sitio ni en el rendimiento general de WordPress.

¿Cuál es la diferencia entre “noopener” y “nofollow”?

Es fácil confundir rel="noopener" con rel="nofollow". Sin embargo, son atributos completamente distintos.

El atributo noopener evita que su sitio web sufra ataques cruzados y mejora la seguridad de WordPress.

Por otro lado, el atributo nofollow impide que su sitio web transmita SEO link juice al sitio web enlazado.

Los motores de búsqueda buscan y tienen en cuenta el atributo nofollow cuando siguen un enlace en su sitio web. Sin embargo, no tienen en cuenta la etiqueta noopener.

Por defecto, WordPress no le permite añadir nofollow a sus enlaces externos. Si desea añadir nofollow en WordPress, entonces tendrá que utilizar un plugin.

Para obtener más información, consulte nuestro artículo sobre cómo añadir título y nofollow a los enlaces en WordPress.

¿Afecta rel=”noreferrer” a los enlaces de afiliados en WordPress?

El rel=" noreferrer” no afecta a los enlaces de afiliados en WordPress. Algunos usuarios creen que sí lo hace porque rel=”noreferrer " impide que la información del referente pase a la nueva pestaña.

Sin embargo, la mayoría de los programas de afiliación le proporcionan una URL única que contiene su ID de afiliado. Esto significa que su ID de afiliado se transmite como parámetro de URL para que el otro sitio web realice el seguimiento.

En segundo lugar, la mayoría de los vendedores afiliados utilizan un plugin link-cloaking para sus enlaces de afiliados.

Con la ocultación de enlaces, el enlace de afiliación en el que hacen clic los usuarios es en realidad la propia URL de su sitio web, que redirige a los usuarios a la URL de destino.

¿Cómo desactivar rel=”noopener” en WordPress?

No es necesario quitar rel="noopener" de los enlaces de su sitio web. Es bueno para la seguridad de su sitio web y no tiene ningún impacto en el rendimiento o SEO de su sitio web.

Sin embargo, si debes eliminarlo, entonces tendrás que desactivar el editor de bloques Gutenberg en WordPress y utilizar el editor clásico.

Esto se debe a que si quita manualmente rel="noopener" del enlace, el editor de bloque lo volverá a añadir automáticamente para mantener seguro su sitio web.

Una vez desactivado el editor de bloques, tendrás que añadir un fragmento de código al archivo functions. php de tu tema o al plugin WPCode (recomendado). Puedes aprender a usar el plugin gratuito W PCode en nuestra guía sobre cómo añadir fácilmente código personalizado en WordPress.

Simplemente copie el siguiente código en un nuevo fragmento de código PHP:

add_filter('tiny_mce_before_init','wpb_disable_noopener');
function wpb_disable_noopener( $mceInit ) {
    $mceInit['allow_unsafe_link_target']=true;
    return $mceInit;
}
Adding a Code Snippet Using WPCode

Asegúrese de activar el conmutador “Activo” y, a continuación, haga clic en el botón “Guardar fragmento de código”.

Esto evitará que WordPress añada rel="noopener" a los nuevos enlaces. También tendrá que editar manualmente los enlaces antiguos para quitar / eliminar el atributo.

¿Quieres tener más control sobre los atributos rel que se añaden a tus enlaces en WordPress? Le recomendamos que utilice el plugin AIOSEO, ya que le permite añadir atributos title, nofollow y otros atributos a los enlaces directamente desde el editor de WordPress.

AIOSEO Adds NoFollow and Title Attributes to the Insert Link Popup

Guías de expertos sobre el uso de enlaces en WordPress

Esperamos que este artículo te haya ayudado a aprender sobre rel="noopener" en WordPress. Puede que también quieras ver otras guías sobre el uso de enlaces en WordPress:

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Descargo: Nuestro contenido está apoyado por los lectores. Esto significa que si hace clic en algunos de nuestros enlaces, podemos ganar una comisión. Vea cómo se financia WPBeginner , por qué es importante, y cómo puede apoyarnos. Aquí está nuestro proceso editorial .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

El último kit de herramientas de WordPress

Obtenga acceso GRATUITO a nuestro kit de herramientas - una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Reader Interactions

27 comentariosDeja una respuesta

  1. Syed Balkhi

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Moinuddin Waheed

    This is very helpful guide for me as I have been teaching html and css to my students and this for have not talked about these two attributes. Most of the teachers only bother to tell target equals blank attribute for opening link in new tabs.
    The best part is that we have all these options at our end in wordpress as well.
    noopener is good for security reasons as it protects from cross site hacking.
    Thanks for this detailed tutorial.

    • WPBeginner Support

      Glad we could share this :)

      Administrador

  3. Oleg Bibik

    Great info, thanks. I now know the difference between noopener and nofollow.

    • WPBeginner Support

      Glad we could help clear that up :)

      Administrador

  4. April

    The noopener is also present with the WordPress Classic editor.

    • WPBeginner Support

      True, we cover the block editor as that is the default editor for WordPress.

      Administrador

  5. Maria

    Is that ok If i am using “noopener & Noreferrer” for interlinking?

    • WPBeginner Support

      You normally shouldn’t add that for internal links but you can if you would like.

      Administrador

  6. Navneet Kumar

    Can we say rel=”noopener no referrer ” provide dofollow backlink to external website?

    I mean if we receive this attribute then we received dofollow backlinks or nofollow backlinks?

    Thanks in advance

    • WPBeginner Support

      These attributes would not affect if a link is dofollow or nofollow, that would be determined if the link is nofollow or not.

      Administrador

  7. Nadya

    is it ok to use rel=”noopener noreferrer nofollow” in any position?

    like

    rel=”nofollow noopener noreferrer”
    rel=”noreferrer nofollow noopener”

    • WPBeginner Support

      You shouldn’t need to worry about the order :)

      Administrador

  8. Ryan

    Thank you for your article.

    I checked my website on web.dev, and I was confused what is noopener and noreferrer.

    After I put it to all of link with target=”_blank”, my best practice score went from <80 to 86.

    Thank you.

    • WPBeginner Support

      Glad our guide could help, don’t forget that sites with scores like that are mainly suggestions :)

      Administrador

  9. Jill

    Hello,

    What about the custom templates used in Wordpress? Should rel=”noopener” be used in the links in the custom posts templates? Especially, internal linking?

    • WPBeginner Support

      You would not need to worry about noopener in the links to the templates for your posts and custom post types.

      Administrador

  10. Graham

    does this affect Analytics? Yes or no?

    • WPBeginner Support

      noreferrer will prevent Google Analytics from tracking the site that the link came from.

      Administrador

  11. Lory

    Can we use noopener but remove noreferrer? Its driving me crazy messing up my analytics. Not only can I not see referral traffic, but I also cannot see which posts have done well over time since referral traffic now shows as direct traffic to my home page. If noopener is the important tag, why is noreferrer included with it? There has to be some way around this.

    • WPBeginner Support

      Unless I hear otherwise, we do not have a specific built-in method to set that up but there are plugins available if you are wanting to remove that from your links.

      Administrador

  12. Zol

    Hye WPbeginner Support, O/

    I don’t use plugin to cloak my affiliate links on my website and I just manually add rel=”nofollow” to affiliate links in html editor.

    My question..is this a good practice for SEO ?
    Should I cloak it?

    Thanks in advanced for your reply.. ;)

    • WPBeginner Support

      Hi Zol,

      It is good practice to cloak URLs. It allows you to better manage links, track your affiliate traffic, and makes your URLs look more understandable by both humans and machines.

      Administrador

  13. Shyam Mahanta

    My wordpress have ssl certificate (auto ssl from the hosting company) but why the secure lock icon doesn’t appear in the Url? It opens in https but shows connection is not secure. Help is really appreciated.

  14. Seleno

    Hello
    I have affiliate website and since wordpress addded noopener my earnings droped down,

    But i was not sure if it can cause this

    So noopener will never effect the affiliate links ?

    Usualy i’m removing it

    And it will not effect the seo or internal links ?
    Thanks

Deja tu comentario

Gracias por elegir dejar un comentario. Tenga en cuenta que todos los comentarios son moderados de acuerdo con nuestros política de comentarios, y su dirección de correo electrónico NO será publicada. Por favor, NO utilice palabras clave en el campo de nombre. Tengamos una conversación personal y significativa.