Si sueles tratar temas de Internet en tu sitio web o haces tutoriales sobre programación, a menudo tendrás que agregar capturas de pantalla de webs en tus artículos para que así se entiendan mucho mejor. Este proceso puede llevarte algo de tiempo: ir al sitio web en cuestión, capturar la pantalla de la página que te interese, editar la imagen resultante para que esté 100% optimizada, subirla a WordPress…
Aunque te resulte algo como de ciencia ficción, debes saber que existe un plugin para WordPress con el que podremos realizar todo este proceso de manera automática. Por eso, en este artículo te explicaremos cómo crear capturas de pantalla de webs en WordPress mediante un plugin.
Crear capturas de pantalla de webs automatizadas mediante un plugin
Lo primero que tienes que hacer es instalar el plugin Browser Shots. Para ello, ve a la sección Plugins del backoffice de tu WordPress y selecciona la opción de Añadir Nuevo. En la página de Añadir Nuevo Plugin, busca el plugin que queremos instalar haciendo uso del campo de búsqueda que se sitúa en la parte superior derecha de la página.
Teclea el nombre del plugin (que como te hemos indicado es “Browser Shots”) y presiona ENTER para iniciar la búsqueda. Si has seguido los pasos al pie de la letra, este plugin te debería aparecer como el primer resultado de la búsqueda. Instálalo y actívalo para poder utilizarlo.
El plugin funciona out of the box, y no necesitas configurar nada de nada.
Ahora, solo tienes que editar un post o una página, o crear una nueva. Verás que hay un nuevo botón en el editor visual de WordPress para añadir capturas de pantalla de webs.
Haciendo clic en dicho botón verás un nuevo popup en el que tendrás que introducir la dirección web de la página a la que quieres hacer un pantallazo. El plugin te permite ingresar otros datos como un texto alternativo, la URL a la que quieres que se dirija el usuario cuando haga clic en ella y también el ancho y alto de la imagen.
Cuando hayas terminado, haz clic en el botón de OK y el plugin añadirá un shortcode al contenido de WordPress que estés editando en ese momento. Si quieres ver el pantallazo dentro del contenido, tendrás que guardarlo y darle al botón de vista previa. O bien, publícalo y visita la parte pública.
Si estás más acostumbrado al editor de texto de WordPress, puedes añadir capturas de pantalla a tus posts y páginas de forma manual añadiendo el shortcode tú mismo.
[browser-shot url=”http://www.wpdirecto.com”]
Por defecto, el plugin creará una captura de pantalla de 600×600 píxeles. Puedes cambiar esto añadiendo los atributos width y height en el propio shortcode.
[browser-shot url=”http://www.wpdirecto.com” width=”400″ height=”400″]
Esto también generará una captura que enlazará automáticamente con la página web a la que estás haciendo el pantallazo. Puedes cambiarlo añadiendo el atributo link al shortcode para definir que enlace a cualquier otra página que desees.
[browser-shot url=”http://www.wpdirecto.com” width=”400″ height=”400″ link=”http://ejemplo.com”]
Si quieres añadir una leyenda debajo de la captura de pantalla, puedes hacerlo metiendo el texto dentro del propio shortcode.
[browser-shot url=”http://www.wpdirecto.com”]WordPress Directo. Noticias, plantillas y plugins para WordPress[/browser-shot]
Por supuesto, está leyenda se mostrará con el estilo prefeterminado que tengas asignado a las plantillas de tu theme. Así es cómo se vería un pantallazo de nuestro sitio web.
El plugin Browser Shots utiliza la API mshots de WordPress.com para generar las capturas de pantalla. Ojo, estas imágenes no se almacenarán en la librería de medios de WordPress sino que se mostrarán directamente desde los servidores de WordPress.com
Y hasta aquí nuestro artículo sobre cómo crear capturas de pantalla de webs en WordPress. Espero que te haya gustado y, si te ha resultado útil, no dudes en compartirlo en redes sociales.
Icono: Royyan Wijaya
