Command Line Usage
If you are using a JSON config file then you don't need to use the command line options. If you use command line options then they will override the JSON config file options.
Command line options
| Argument | Type | Default | Description |
|---|---|---|---|
-b, --base | string | The base URL value. If set then the URL will be appended to this value. | |
--blockAdsAndCookieNotices | boolean | true | Whether or not to block ads and cookie notices. This will block all ads and cookie notices on the page. |
--clipH | integer | The height of the clip area. | |
--clipW | integer | The width of the clip area. | |
--clipX | integer | The x-coordinate of top-left corner of clip area. | |
--clipY | integer | The y-coordinate of top-left corner of clip area. | |
-c, --config | string | The name of the JSON config file to use to get the screenshots. You can specify one or more values. | |
-D, --delay | integer | The number of milliseconds to delay after loading before taking a picture of the page. Can't be larger than 30000. | |
-d, --dir | string | The directory relative to where the script is run to output the screenshots to. | |
-f, --fit | Fit the screenshot to the provided height and width. | ||
-F, --fullScreen | boolean | true | Whether or not to have the screenshot capture the full width and height of the page. |
-h, --height | integer | 900 | Integer height of the viewport to take the screenshot in. Use --fit if you want the screenshot to only capture the viewport width and height. Defaults to 900. |
--help | Show help for the command. | ||
--hideSelector | string | The CSS selector of the element(s) to hide during the screenshot process. The elements are hidden before any screenshot or scrolling is done. You can specify one or more values. | |
--hideStitchSelector | string | The CSS selector of the element to hide during the screenshot process if screenshots are stitched together. The elements are hidden after the first scroll. Common usage is to hide a sticky header or floating element. You can specify one or more values. | |
--jpg | Set the image type for screenshots to be jpg. Alternate method to using -t. | ||
-n, --name | string | The name of the file to save the screenshot as. It can also be a name format that will be used to build the filename for each screenshot. If you're not setting a name format, then the name only applies to the first URL so it's only useful if getting just one screenshot. | |
--pixelRatio | number | 1 | The device pixel ratio to use for the screenshot. |
--png | Set the image type for screenshots to be png. Alternate method to using -t. | ||
-q, --quality | integer | 100 | The quality of the jpg image, between 0-100. Not applicable to png image. |
-s, --size | string | A viewport size to capture the screenshot in. The format is WIDTHxHEIGHT. For example, 800x400 for a width of 800px and a height of 400px. Use --fit if you want the screenshot to only capture the viewport width and height. You can specify more than one value to capture multiple sizes. | |
--scrollDelay | integer | The number of milliseconds to delay after each scroll to allow the content to load. This is used to allow time for lazy loading of images or animations that are triggered by the scroll to complete. Defaults to 400. | |
--stitchThreshold | integer | 16000 | This determines the maximum pixel height of the screenshot that can be taken natively before falling back to stitching screenshots together. It's based on the maximum texture size supported by Chromium's software GL backend. Visit https://webglreport.com/ in Chrome and check the 'Max Texture Size' value to see the maximum texture size supported by the browser. |
-t, --type | string | jpg | The file type to use for the screenshots. jpg, png, or webp. |
-u, --url | string | URL to get the screenshot of. You can specify this parameter multiple times to get a screenshot of multiple web pages. | |
-w, --width | integer | 1300 | Integer width of the viewport to take the screenshot in. |
--waitUntil | string | The wait until value to use for the page. Allowed values are: domcontentloaded, load, networkidle0, networkidle2. Defaults to load. It is recommended to start with load and only use networkidle0 or networkidle2 if you have a specific reason to do so. An example reason could be waiting for a specific API call to complete before taking the screenshot. | |
--webp | Set the image type for screenshots to be webp. Alternate method to using -t. | ||
-v, --version | Output the version number. |
If you are not using a JSON config file then you must specify the -u or --url argument to get a screenshot of a web page.
Examples
Specify the name of the JSON file to use
Use the -c or --config argument to specify the JSON config file to use.
page-shots -c myfile.json
When specifying the name of the JSON config file you don't have to include the .json extension. If the extension of the file is not .json then it's automatically added.
page-shots -c myfile
You can specify multiple JSON config files to use by passing in multiple file names.
page-shots -c myfile.json -c myfile2.json
You can also use a glob pattern to specify the JSON files to use.
page-shots -c myfile*.json
You can also process all of the JSON files in the current directory by passing in a wildcard.
page-shots -c *.json
The default name for the JSON config file is shots.json. If the JSON file exists in the current directory and it's called shots.json then you don't have to specify the file name. If no URLs are provided to get screenshots of then the program will look for the shots.json file in the current directory and use it if it exists.
This allows you to just call page-shots on the command line and it will use the shots.json file in the current directory if it exists.
page-shots
Get a screenshot of just one URL and output it in the same directory.
page-shots -u https://www.aptuitiv.com
Get a screenshot of just one URL and specify the directory and file name.
page-shots -u https://www.aptuitiv.com -d screenshots -n home
Get a screenshot of just one URL and specify the directory and file name. The file will be saved as a "png" because of the file name extension.
page-shots -u https://www.aptuitiv.com -d screenshots -n home.jpg
Specify a file name format
page-shots -u https://www.aptuitiv.com -n home-{width}
Specify a file name format and set the image to be a png based on the file name
page-shots -u https://www.aptuitiv.com -n home-{width}.png
Get screenshots for multiple URLs and save to a specific directory.
page-shots -u https://www.aptuitiv.com -u https://www.aptuitiv.com -d screenshots
Set a base URL and get a screenshot of multiple URLs in the same website.
page-shots -b https://www.aptuitiv.com -u /pricing -u / -u /docs
Save the screenshot as a png image.
page-shots -u https://www.aptuitiv.com -t png
Change the image quality for the jpg screenshot to 80.
page-shots -u https://www.aptuitiv.com -q 80
Capture a smaller screen size to simulate a mobile device.
page-shots -u https://www.aptuitiv.com -w 415
Get a screenshot at a specific height and width.
page-shots -u https://www.aptuitiv.com -w 1200 -h 800 --fit
Set the screenshot size using the size argument.
The size argument requires that both the width and height be set. Use this format:
WIDTHxHEIGHT
There should not be a space between the width, the "x", and the height.
Set the width to be 1000px and the height to be 600px.
page-shots -u https://www.aptuitiv.com -s 1000x600
Set multiple screenshot sizes.
The following will set the following screenshot sizes:
- 1000px width and 600px height
- 600px width and 600px height
- 400px width and 800px height
Because the
--fitparameter is not set only the width actually applies to the screenshot.
page-shots -u https://www.aptuitiv.com -s 1000x600 -s 600x600 -s 400x800
Delay for 3 seconds after loading the page before taking the screenshot
page-shots -u https://www.aptuitiv.com -w 1200 --delay 3000
Capture just a clip on the page 100px down from the top that is 900px wide and 400px tall.
page-shots -u https://www.aptuitiv.com -w 1200 --clipH 400 --clipW 900 --clipX 0 --clipY 100