You can specify any URL2PNG parameters as a suffix of the original website being captured.
The suffix should be /url2png/ followed by any parameters of URL2PNG in the format key=value|key=value|key=value.
Here's an example:
For a URL like the following http://www.site.com/?a=b you can add URL2PNG parameters like:http://www.site.com/?a=b/url2png/viewport=240x320|fullpage=false
Then you can use a code like the following example to generate the image (in Rails):
cl_image_tag("http://www.site.com/?a=b/url2png/viewport=240x320|fullpage=false", :type => :url2png, :sign_url => true)
The generated screenshot can then be further manipulated using Cloudinary's transformations.
Some sites (e.g., flash sites) start by showing only the background and gradually add more content to the page within a few seconds.
Here is another code snippet in NodeJS with more URL2PNG parameters, for example, the delay parameter.
const url= cloudinary.url("https://cnn.com/url2png/viewport=240x320|delay=9|fullpage=false", { sign_url: true, type: "url2png"})
console.log(url)
The URL of this code is the following:
https://res.cloudinary.com/wissamkhalilicloudinary/image/url2png/s--mXcqZEhc--/https://cnn.com/url2png/viewport%3D240x320%7Cdelay%3D9%7Cfullpage%3Dfalse
Another parameter that we could use is the user_agent.
Here is an example of iPhone 13:
const url= cloudinary.url("https://cnn.com/url2png/fullpage=false|user_agent=Mozilla/5.0 (iPhone; CPU iPhone OS 13_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/11.2 Mobile/15E148 Safari/604.1",
{ sign_url: true, type: "url2png"})
console.log(url)
The URL of this code is the following:
Please note that in order to regenerate the most updated site's image, you need the explicit API method . Here is an example in (NodeJS):
cloudinary.uploader.explicit("https://cnn.com/url2png/fullpage=false|viewport=320x640",
{ sign_url: true, type: "url2png"},
function(error, result) {console.log(result, error); });
Comments
2 comments
4 months later
Here.
https://cloudinary.com/blog/website_screenshot_creation_and_manipulation_with_url2png_and_cloudinary
Please sign in to leave a comment.