Cómo crear capturas de pantalla de sitios web automatizados en WordPress

¿Desea crear capturas de pantalla automatizadas de sitios web en su sitio de WordPress? Si agrega con frecuencia capturas de pantalla de sitios web a sus publicaciones o páginas de WordPress, la automatización del proceso le ahorrará tiempo dedicado a capturar capturas de pantalla manualmente. En este artículo, le mostraremos cómo crear capturas de pantalla automatizadas de sitios web en WordPress.

Método 1: crear capturas de pantalla automáticas de sitios web en WordPress usando el complemento

Este método es más fácil, por lo tanto, se recomienda para principiantes y usuarios que no quieran tratar con el código..

Lo primero que debes hacer es instalar y activar el complemento de instantáneas del navegador. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.

El complemento funciona de inmediato, y no hay configuraciones para configurar.

Simplemente edita una publicación / página o crea una nueva. Notará un nuevo botón en el editor visual para agregar capturas de pantalla del sitio web.

Al hacer clic en él aparecerá una ventana emergente donde puede ingresar la URL del sitio web, el texto alternativo, el enlace a la URL y la altura / anchura de la captura de pantalla.

Haga clic en el botón Aceptar y el complemento agregará un código corto a su publicación de WordPress. Ahora puede obtener una vista previa de su publicación para ver el complemento en acción.

Si está utilizando el editor de texto en WordPress o no quiere usar el botón en el editor visual, también puede agregar el shortcode manualmente..

[browser-shot url = "https://www.wpbeginner.com"]

De forma predeterminada, el complemento creará una captura de pantalla de 600 x 600 píxeles. Puede cambiar eso agregando los atributos de ancho y alto al código corto.

[browser-shot url = "https://www.wpbeginner.com" width = "400" height = "400"]

También se vinculará automáticamente a la página web. Puede cambiar eso agregando un atributo de enlace al shortcode y agregando cualquier enlace que desee.

[browser-shot url = "https://www.wpbeginner.com" width = "400" height = "400" link = "http://example.com"]

Si desea agregar un título debajo de la captura de pantalla, puede hacerlo envolviendo el texto del título alrededor del shortcode.

[browser-shot url = "https://www.wpbeginner.com"] WPBeginner - Sitio de recursos de WordPress para principiantes [/ browser-shot]

La leyenda usará los estilos de leyenda del tema de WordPress. Aquí es cómo se veía en nuestro sitio web de demostración:

El complemento Browser Shots utiliza la API mshots de WordPress.com para generar capturas de pantalla sobre la marcha. Estas imágenes no se almacenan en su biblioteca de medios de WordPress. Se sirven directamente desde los servidores de WordPress.com..

Vea nuestra guía sobre la diferencia entre WordPress.com y WordPress.org.

Método 2: crear capturas de pantalla automatizadas agregando código a WordPress

Este método requiere que agregues código a tus archivos de WordPress. No es recomendable para principiantes. Si te sientes cómodo pegando fragmentos de la web en WordPress, puedes usar este método.

Simplemente agregue este código al archivo functions.php de su tema o a un complemento específico del sitio.

 function wpb_screenshots ($ atts, $ content = NULL) extract (shortcode_atts (array ("snap" => 'http://s.wordpress.com/mshots/v1/', "url" => 'https: // www.wpbeginner.com ', "alt" =>' screenshot ', "w" =>' 600 ', // width "h" =>' 450 '// height), $ atts)); $ img = ''; devuelve $ img;  add_shortcode ("screen", "wpb_screenshots"); 

Similar al complemento que mencionamos anteriormente, este código también utiliza la API mshots de WordPress.com para generar capturas de pantalla sobre la marcha.

Para mostrar una captura de pantalla de un sitio web en sus publicaciones y páginas de WordPress, deberá ingresar el código abreviado de la siguiente manera:

[pantalla url = "http://wpbeginner.com" alt = "WPBeginner"]

Reemplace los campos de URL y Alt con sus propios valores.

Por defecto, este código generará una captura de pantalla de 600 x 450 píxeles. Puede cambiar eso agregando sus propios atributos de altura y anchura al código corto.

[pantalla url = "http://wpbeginner.com" alt = "WPBeginner" w = "400" h = "400"]

Eso es todo, esperamos que este artículo te haya ayudado a aprender cómo crear capturas de pantalla automatizadas de sitios web en WordPress. También puede consultar nuestra guía sobre cómo automatizar WordPress y las redes sociales con IFTTT..

Si le ha gustado este artículo, suscríbase a nuestros tutoriales en video del Canal de YouTube para WordPress. También puedes encontrarnos en Twitter y Facebook..