Outils pour capturer et convertir le Web
miniature du site

Créer des vignettes de sites Web avec GrabzIt

Les développeurs Web ont souvent besoin de créer des aperçus de la page Web. Pour améliorer les taux de clic et pour le partage sur Facebook et autres médias sociaux.

Par défaut API de GrabzIt Outil de capture en ligne créera des vignettes de site Web en réduisant la capture d'écran. Jusqu'à ce que cela corresponde à la taille maximale autorisée sur le package de l'utilisateur.

Toutefois, si vous souhaitez créer une image miniature à vos propres dimensions. Ensuite, il est recommandé que la vignette soit inférieure à la taille des paramètres browserWidth et browserHeight. C'est 1024px et 768px respectivement par défaut.

Il est également important que le rapport largeur / hauteur de la vignette reste identique à la largeur et à la hauteur du navigateur. Cela évite que la vignette de la capture d'écran de la page Web ne soit déformée.

Calculateur de vignettes

px
px
19%
195px
146px

Cette calculatrice calcule automatiquement la largeur et la hauteur optimales pour vos vignettes. En fonction du pourcentage, la vignette doit correspondre à la largeur et à la hauteur du navigateur. Tout en maintenant également l'image proportionnelle à la taille du navigateur afin d'arrêter tout étirement de l'image.

Pour plus de commodité, les modifications apportées à cette calculatrice sont reflétées dans les exemples de code ci-dessous.

Comment utiliser notre API de miniatures de sites Web

Intégrer la possibilité de prendre des vignettes de pages Web into votre application avec l'API de capture d'écran de GrabzIt. Pour commencer, choisissez l’un des huit langages de programmation pris en charge ci-dessous pour voir un exemple de code et des instructions supplémentaires.

Cet exemple de code montre à quel point il est facile de créer une vignette de site Web à l'aide d'ASP.NET. Pour commencer à capturer des vignettes seulement télécharger la bibliothèque ASP.NET. Alors récupérez votre API clé et secret et alors utiliser la démo contenu dans. Puis consultez le capture d'écran de la documentation pour ASP.NET pour découvrir toutes les manières d'utiliser l'API de GrabzIt.

ImageOptions options = new ImageOptions();
options.BrowserWidth = 1024;
options.BrowserHeight = 768;
options.Width = 195;
options.Height = 146;

GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");
grabzIt.URLToImage("https://www.tesla.com", string.Empty, 1024, 768, 195, 146, ImageFormat.jpg, 0, string.Empty, 
BrowserType.StandardBrowser, string.Empty); 
grabzIt.SaveTo("images/result.jpg");

Cet exemple de code montre à quel point il est facile de créer une vignette de site Web à l'aide de Java. Pour commencer à capturer des vignettes seulement télécharger la bibliothèque Java. Alors récupérez votre API clé et secret et alors utiliser la démo contenu dans. Puis consultez le capture d'écran de la documentation de l'API pour Java pour découvrir toutes les manières d'utiliser l'API de GrabzIt.

ImageOptions options = new ImageOptions();
options.setBrowserWidth(1024);
options.setBrowserHeight(768);
options.setWidth(195);
options.setHeight(146);

GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");
grabzIt.URLToImage("https://www.tesla.com", options); 
grabzIt.SaveTo("images/result.jpg");

Cet exemple de code montre à quel point il est facile de créer une vignette de site Web à l'aide de JavaScript. Pour commencer à capturer des vignettes, téléchargez Bibliothèque JavaScript de GrabzIt. Alors récupérez votre API clé et secret, ajouter le domaine vous voulez utiliser le JavaScript, puis consultez le capture d'écran de la documentation de l'API pour JavaScript pour découvrir toutes les manières d'utiliser l'API de GrabzIt.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.3.7/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("https://www.tesla.com", 
{"bwidth":1024,"bheight":768,"width":195,"height":146}).Create();
</script>

Cet exemple de code montre à quel point il est facile de créer une vignette de site Web à l'aide de Node.js. Pour commencer à capturer des vignettes seulement téléchargez le package Node.js. Alors récupérez votre API clé et secret et alors utiliser la démo contenu dans. Puis consultez le capture d'écran de la documentation de l'API pour Node.js pour découvrir toutes les manières d'utiliser l'API de GrabzIt.

var grabzit = require('grabzit');

var options = {"width":195, "height":146, 
    "browserHeight":768, "browserWidth":1024};

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");
client.url_to_image("https://www.tesla.com", options);
client.save_to("images/result.jpg", function (error, id){
    if (error != null){
        throw error;
    }
});

Cet exemple de code montre à quel point il est facile de créer une vignette de site Web à l'aide de Perl. Pour commencer à capturer des vignettes seulement télécharger la bibliothèque Perl. Alors récupérez votre API clé et secret et alors utiliser la démo contenu dans. Puis consultez le capture d'écran de la documentation de l'API pour Perl pour découvrir toutes les manières d'utiliser l'API de GrabzIt.

#!/usr/bin/perl

use GrabzItClient;

$options = GrabzItImageOptions->new();
$options->browserWidth(1024);
$options->browserHeight(768);
$options->width(195);
$options->height(146);

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");
$grabzIt->URLToImage("https://www.tesla.com", '', 1024, 768, 195, 146);
$grabzIt->SaveTo("images/result.jpg");

Cet exemple de code montre à quel point il est facile de créer une vignette de site Web à l'aide de PHP. Pour commencer à capturer des vignettes seulement télécharger la bibliothèque PHP. Alors récupérez votre API clé et secret et alors utiliser la démo contenu dans. Puis consultez le capture d'écran de la documentation API pour PHP pour découvrir toutes les manières d'utiliser l'API de GrabzIt.

include("GrabzItClient.php");

$options = new \GrabzIt\GrabzItImageOptions();
$options->setBrowserWidth(1024);
$options->setBrowserHeight(768);
$options->setWidth(195);
$options->setHeight(146);

$grabzIt = new \GrabzIt\GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");
$grabzIt->URLToImage("https://www.tesla.com", $options); 
$grabzIt->SaveTo("images/result.jpg");

Cet exemple de code montre à quel point il est facile de créer une vignette de site Web à l'aide de Python. Pour commencer à capturer des vignettes seulement télécharger la bibliothèque Python. Alors récupérez votre API clé et secret et alors utiliser la démo contenu dans. Puis consultez le capture d'écran de la documentation de l'API pour Python pour découvrir toutes les manières d'utiliser l'API de GrabzIt.

from GrabzIt import GrabzItClient
from GrabzIt import GrabzItImageOptions

options = GrabzItImageOptions.GrabzItImageOptions()
options.browserWidth = 1024
options.browserHeight = 768
options.width = 195
options.height = 146

grabzIt = GrabzItClient.GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret")
grabzIt.URLToImage("https://www.tesla.com", options) 
grabzIt.SaveTo("images/result.jpg") 

Cet exemple de code montre à quel point il est facile de créer une vignette de site Web à l'aide de Ruby. Pour commencer à capturer des vignettes seulement télécharger le Ruby Gem. Alors récupérez votre API clé et secret et alors utiliser la démo contenu dans. Puis consultez le capture d'écran de la documentation API pour Ruby pour découvrir toutes les manières d'utiliser l'API de GrabzIt.

require 'grabzit'

options = GrabzIt::ImageOptions.new()
options.browserWidth = 1024
options.browserHeight = 768
options.width = 195
options.height = 146

grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret")
grabzItClient.url_to_image("https://www.tesla.com", options)	
grabzItClient.save_to("images/result.jpg")