Webをキャプチャして変換するツール
ウェブサイトのサムネイル

GrabzItでWebサイトのサムネイルを作成する

多くの場合、Web開発者はWebページのプレビューを作成する必要があります。 クリックスルー率を改善し、Facebookやその他のソーシャルメディアで共有するため。

デフォルトでは GrabzItのAPI & オンラインスクリーンショットツール will get website thumbnails by shrinking the website screenshot. Until it fits within the maximum size allowed on the user's package.

To create a thumbnail image to your own specific dimensions. You should ensure that the thumbnail is smaller than the browserWidth and browserHeight parameters. This is 1366px and 1170px respectively by default.

Also important is to keep the ratio of the thumbnail width and height to the browser width and height. This prevents the thumbnail image of the web page screenshot from becoming distorted.

Of course you can take bigger screenshots with GrabzIt, for instance you can capture full page screenshots.

サムネイル電卓

px
px
19%
195px
146px

This calculator automatically calculates the best width and height for your thumbnails. Based on what percentage the thumbnail should be of the browser width and height. While also keeping the image proportional to the browser size to stop any stretching of the image.

The calculator above puts any changes made into the code examples below.

Website Thumbnail APIの使用方法

IntWebページのサムネイルを取得する機能を強化する into your application with GrabzIt's Screenshot API. To begin, select one of the nine programming languages below. To view a code example and instructions on how to proceed.

このコード例は、ASP.NETを使用してWebサイトのサムネイルを簡単に作成できることを示しています。 サムネイルのキャプチャを開始するには ASP.NETライブラリをダウンロードする。 次に、APIを取得します 鍵と秘密 その後 デモを使用する 内に含まれます。 次に、 ASP.NETのスクリーンショットAPIドキュメント GrabzIt の API を使用するすべての方法を学習します。

ImageOptions options = new ImageOptions();
options.BrowserWidth = ;
options.BrowserHeight = ;
options.Width = ;
options.Height = ;

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, , , , , ImageFormat.jpg, 0, string.Empty, 
BrowserType.StandardBrowser, string.Empty); 
grabzIt.SaveTo("images/result.jpg");

このコード例は、Javaを使用してWebサイトのサムネイルを簡単に作成できることを示しています。 サムネイルのキャプチャを開始するには Javaライブラリをダウンロードする。 次に、APIを取得します 鍵と秘密 その後 デモを使用する 内に含まれます。 次に、 JavaのスクリーンショットAPIドキュメント to discover all the ways you can use GrabzIt's API.

ImageOptions options = new ImageOptions();
options.setBrowserWidth();
options.setBrowserHeight();
options.setWidth();
options.setHeight();

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");

このコード例は、JavaScriptを使用してWebサイトのサムネイルを簡単に作成できることを示しています。 サムネイルのダウンロードを開始するには GrabzItのJavaScriptライブラリ。 次に、APIを取得します 鍵と秘密, ドメインを追加 JavaScriptを使用してから、 JavaScriptのスクリーンショットAPIドキュメント to discover all the ways you can use GrabzIt's API.

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

このコード例は、Node.jsを使用してWebサイトのサムネイルを簡単に作成できることを示しています。 サムネイルのキャプチャを開始するには Node.jsパッケージをダウンロードする。 次に、APIを取得します 鍵と秘密 その後 デモを使用する 内に含まれます。 次に、 Node.jsのスクリーンショットAPIドキュメント to discover all the ways you can use GrabzIt's API.

var grabzit = require('grabzit');

var options = {"width":, "height":, 
    "browserHeight":, "browserWidth":};

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;
    }
});

このコード例は、Perlを使用してWebサイトのサムネイルを簡単に作成できることを示しています。 サムネイルのキャプチャを開始するには Perlライブラリをダウンロードする。 次に、APIを取得します 鍵と秘密 その後 デモを使用する 内に含まれます。 次に、 PerlのスクリーンショットAPIドキュメント to discover all the ways you can use GrabzIt's API.

#!/usr/bin/perl

use GrabzItClient;

$options = GrabzItImageOptions->new();
$options->browserWidth();
$options->browserHeight();
$options->width();
$options->height();

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

このコード例は、PHPを使用してWebサイトのサムネイルを簡単に作成できることを示しています。 サムネイルのキャプチャを開始するには PHPライブラリをダウンロードする。 次に、APIを取得します 鍵と秘密 その後 デモを使用する 内に含まれます。 次に、 PHPのスクリーンショットAPIドキュメント to discover all the ways you can use GrabzIt's API.

include("GrabzItClient.php");

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

$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");

このコード例は、Pythonを使用してWebサイトのサムネイルを簡単に作成できることを示しています。 サムネイルのキャプチャを開始するには Pythonライブラリをダウンロードする。 次に、APIを取得します 鍵と秘密 その後 デモを使用する 内に含まれます。 次に、 PythonのスクリーンショットAPIドキュメント to discover all the ways you can use GrabzIt's API.

from GrabzIt import GrabzItClient
from GrabzIt import GrabzItImageOptions

options = GrabzItImageOptions.GrabzItImageOptions()
options.browserWidth = 
options.browserHeight = 
options.width = 
options.height = 

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") 

These API calls shows how easy it is to create a website thumbnail using GrabzIt's RESTful API. Check out the RESTfulスクリーンショットAPI documentation to discover all the ways you can use GrabzIt.

https://api.grabz.it/services/convert?key=Sign in to view your Application Key&format=jpg&bwidth=&bheight=&width=&height=&url=https%3A%2F%2Fwww.tesla.com%2F

このコード例は、Rubyを使用してWebサイトのサムネイルを簡単に作成できることを示しています。 サムネイルのキャプチャを開始するには Ruby Gemをダウンロードする。 次に、APIを取得します 鍵と秘密 その後 デモを使用する 内に含まれます。 次に、 RubyのスクリーンショットAPIドキュメント to discover all the ways you can use GrabzIt's API.

require 'grabzit'

options = GrabzIt::ImageOptions.new()
options.browserWidth = 
options.browserHeight = 
options.width = 
options.height = 

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")