¿Has visto alguna vez sitios que muestran una vista previa en directo de los enlaces cuando pasas el ratón por encima? Eso es usando un mensaje / ventana emergente jQuery que muestra una captura de pantalla de una página enlazada cuando los usuarios pasan el ratón por encima del enlace. En este artículo le mostraremos cómo mostrar una vista previa en vivo de los enlaces en WordPress.
Video Tutorial
Si no te gusta el vídeo o necesitas más instrucciones, sigue leyendo.
Lo primero que tienes que hacer es instalar y activar el plugin WP Live Preview Links. Al activarlo, aparecerá un nuevo elemento / artículo etiquetado Live Preview Links en tu barra de administrador de WordPress. Al hacer clic en él, accederás a la página de ajustes del plugin.
Usando este plugin, puedes tener vistas previas en vivo para enlaces externos, internos, todos o selectivos. Dependiendo de lo que estés tratando de lograr, muchos sitios usan vistas previas en vivo para sitios externos. Algunos sitios de comercio electrónico utilizan vistas previas en vivo para mostrar un vistazo a las páginas de productos. Tenga en cuenta que demasiadas vistas previas en vivo pueden distraer y molestar a los usuarios.
Elegir class="wp-live-preview" te permitirá mostrar manualmente vistas previas en directo de los enlaces a medida que los añades. Simplemente añada la clase a sus enlaces de la siguiente manera:
<a href="http://www.example.com" class="wp-live-preview">Enlace de ejemplo</a>
Entre otros ajustes, puede elegir el tamaño de la ventana emergente de vista previa en directo, la posición y el área visible del sitio del enlace enlazado. Los ajustes por defecto funcionan para la mayoría de los sitios. Simplemente haga clic en el botón guardar cambios para establecer sus ajustes.
Ahora puede visitar su sitio web para ver en acción la vista previa en directo de los enlaces.
Esperamos que este artículo te haya ayudado a aprender cómo mostrar una vista previa en vivo de los enlazes en WordPress. Puede que también quieras echar un vistazo a nuestra guía sobre cómo enlazar enlaces rotos en WordPress con el comprobador de enlaces rotos.
Si te ha gustado este artículo, suscríbete a nuestro canal de YouTube para ver tutoriales en vídeo sobre WordPress. También puedes encontrarnos en Twitter y Google+.
Syed Balkhi says
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!
Colin says
Thanks for the article, that plugin has ceased operation and is no longer downloadable, if you had a new suggestion that works I’d greatly appreciate it. The RT Media paid version isn’t up to scratch and there’s not a lot to be found via Google.
WPBeginner Support says
Thank you for letting us know, we will be sure to look into updating this article
Administrador
Marcus Quiroga says
Hi,
Is there an update of this function nowadays? I’m trying it on external links at. Does someone could help me with that?
thank you
WPBeginner Staff says
Thanks for correcting us, we have updated the article.
Tim Roberts says
How do you get this to on work on specifc links.
WPBeginner Staff says
Unfortunately plugin does not have a way to show preview for selective links you can only choose from all, internal, or external links.
Bruce Brown says
Select the “class” option, then put the class on the links you want to display.
Per Søderlind says
Hi, I’m the plugin author.
You can get this to work on specific links by adding class=”wp-live-preview” to the link, and in the settings page set ‘Live Preview Links’ to ‘class=”wp-live-preview’. See the demo links on my site.