Comment créer des captures d'écran automatisées de sites Web dans WordPress

Voulez-vous créer des captures d'écran automatisées de sites Web sur votre site WordPress? Si vous ajoutez fréquemment des captures d'écran de sites Web à vos publications ou pages WordPress, alors l'automatisation du processus vous permettra de gagner du temps sur la capture manuelle des captures d'écran. Dans cet article, nous allons vous montrer comment créer des captures d'écran automatisées de sites Web dans WordPress..

Méthode 1: Créer des captures d'écran automatiques de sites Web dans WordPress à l'aide de Plugin

Cette méthode est plus facile donc recommandée pour les débutants et les utilisateurs qui ne veulent pas traiter avec du code.

La première chose à faire est d’installer et d’activer le plug-in Browser Shots. Pour plus de détails, consultez notre guide étape par étape pour installer un plugin WordPress..

Le plug-in fonctionne immédiatement, et vous n'avez aucun paramètre à configurer..

Modifiez simplement un article / une page ou créez-en un nouveau. Vous remarquerez un nouveau bouton dans l'éditeur visuel pour ajouter des captures d'écran du site.

Cliquez dessus pour afficher une fenêtre contextuelle dans laquelle vous pouvez entrer l'URL du site Web, le texte de remplacement, le lien vers l'URL et la hauteur / largeur de la capture d'écran..

Cliquez sur le bouton OK et le plugin ajoutera un shortcode à votre message WordPress. Vous pouvez maintenant prévisualiser votre message pour voir le plugin en action.

Si vous utilisez l'éditeur de texte dans WordPress ou si vous ne souhaitez pas utiliser le bouton dans Visual Editor, vous pouvez également ajouter manuellement le shortcode vous-même..

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

Par défaut, le plugin créera une capture d'écran de 600 x 600 pixels. Vous pouvez changer cela en ajoutant les attributs width et height au shortcode..

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

Il sera également automatiquement lié au site Web. Vous pouvez changer cela en ajoutant un attribut link au shortcode et en ajoutant le lien de votre choix..

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

Si vous souhaitez ajouter une légende sous la capture d'écran, vous pouvez le faire en entourant le texte de la légende autour du shortcode..

[browser-shot url = "https://www.wpbeginner.com"] WPBeginner - Site de ressources WordPress pour débutants [/ browser-shot]

La légende utilisera les styles de légende de votre thème WordPress. Voici à quoi cela ressemblait sur notre site de démonstration:

Le plug-in Browser Shots utilise l’API mshots de WordPress.com pour générer des captures d’écran à la volée. Ces images ne sont pas stockées dans votre médiathèque WordPress. Ils sont servis directement à partir des serveurs WordPress.com.

Voir notre guide sur la différence entre WordPress.com et WordPress.org.

Méthode 2: Créer des captures d'écran automatisées en ajoutant du code à WordPress

Cette méthode nécessite que vous ajoutiez du code à vos fichiers WordPress. Ce n'est pas recommandé pour les débutants. Si vous êtes prêt à coller des extraits de sites Web dans WordPress, vous pouvez utiliser cette méthode..

Ajoutez simplement ce code au fichier functions.php de votre thème ou à un plugin spécifique au site..

 function wpb_screenshots ($ atts, $ content = NULL) extract (shortcode_atts (array ("snap" => ".>". www.wpbeginner.com ', "alt" =>' capture d'écran "," w "=> '600', // largeur" ​​h "=> '450' // hauteur), $ atts)); $ img = ''; return $ img;  add_shortcode ("screen", "wpb_screenshots"); 

Semblable au plugin que nous avons mentionné précédemment, ce code utilise également l'API mshots de WordPress.com pour générer des captures d'écran à la volée..

Pour afficher une capture d'écran de site Web dans vos publications et pages WordPress, vous devez entrer le shortcode de la manière suivante:

[URL de l'écran = "http://wpbeginner.com" alt = "WPBeginner"]

Remplacer les champs URL et Alt par vos propres valeurs.

Par défaut, ce code générera une capture d'écran de 600 x 450 pixels. Vous pouvez changer cela en ajoutant vos propres attributs de hauteur et de largeur au shortcode..

[URL de l'écran = "http://wpbeginner.com" alt = "WPBeginner" w = "400" h = "400"]

C’est tout, nous espérons que cet article vous a appris à créer des captures d’écran automatisées de sites Web dans WordPress. Vous voudrez peut-être aussi voir notre guide sur la façon d’automatiser WordPress et les médias sociaux avec IFTTT.

Si vous avez aimé cet article, abonnez-vous à nos tutoriels vidéo sur la chaîne YouTube pour WordPress. Vous pouvez aussi nous trouver sur Twitter et Facebook.