Last Updated: February 25, 2016
·
2.576K
· wookiecooking

Take responsive screenshots with phantomjs

Requires async; npm install async or include in your package.json file.

var async = require('async'),
    sizes = [
        [320, 480],
        [320, 568],
        [800, 600],
        [600, 1024],
        [1024, 768],
        [1136, 640],
        [640, 1136],
        [720, 1280],
        [1280, 720],
        [1280, 800],
        [1440, 900],
        [1920, 1080],
        [1080, 1920]
    ],
    args = require('system').args,
    address = '',
    dirdump = './screenshots/',
    UAgent = 'Googlebot/2.1 (+http://www.googlebot.com/bot.html)';

    args.forEach(function(arg, i) {
        if(i == 1) {
           address = arg;
        }
    });

function capture(sizes, callback) {
    var page = require('webpage').create();
    page.settings.userAgent = UAgent';

    // Run The Array
    page.viewportSize = {
        width: sizes[0],
        height: sizes[1]
    };

    page.zoomFactor = 1;
    page.open(address, function (status) {
        var filename = sizes[0] + 'x' + sizes[1] + '.png';
        page.render(dirdump + filename);
        page.close();
        callback.apply();
    });
}

async.eachSeries(sizes, capture, function (e) {
    if (e) console.log(e);
    console.log('done!');
    phantom.exit();
});

1 Response
Add your response

page.settings.userAgent = 'UAgent';

over 1 year ago ·