How to take full webpage screenshots instantly

Hands up if you have ever needed to take a screenshot of an entire webpage, not just what’s immediately visible on your monitor. Keep your hands up if you then proceeded to take screenshots of the webpage in sections, then used a photo editing program to stitch them together. Read on for a time-saving tip!

If you aren’t already aware, there are a number of options that will make this tedious task easier, such as using a standalone screenshot tool, a browser extension or a third-party web-based tool. While, all these options have their merits, they can cost you money or take just as much time as the first method.

Thankfully, there is a much quicker method. Instantaneous, in fact. And it doesn’t involve having to install browser extensions. It uses built-in browser tools, available in Firefox and Chrome.

Capture full page screenshot using Chrome’s Developer Tools

As of Chrome version 59, the Capture full size screenshot tool is included in the Developer Tools. There are two ways to access the tool:

• Using the Command Menu: this allows you to take a full page screenshot at the current desktop size.
• Using Device Mode: this allows you emulate various preset mobile devices or set a custom screen size that you can then take a full page screenshot of.

Using the Command Menu

Here’s how to instantly capture a full page screenshot using the Command Menu in Chrome:

1. Open the Developer Tools.
   You can do this by clicking the More icon (3 dots in the top right of the browser), then clicking More tools > Developer tools.
   Alternatively, you can use the shortcut Alt + Command + I on a Mac or Ctrl + Shift + I on Windows/Linux/Chrome OS.
2. Open the Command Menu.
   Click Command+Shift+P on a Mac or Control+Shift+P on Windows/Linux/Chrome OS.
3. Type “screenshot” in the Command Menu.
   You will see the “Capture full size screenshot” option in the menu.
   
4. Select Capture full size screenshot.
   Chrome will automatically save a full page screenshot in PNG format to your default downloads folder.

Using Device Mode

Here’s how to instantly capture a full page screenshot using Device Mode in Chrome:

1. Open the Developer Tools using the steps above.
2. Turn on Device Mode.
   You can do this by clicking on the Toggle device toolbar icon in the Developer Tools Toolbar
   
   Alternatively, you can use the shortcut Command+Shift+M on a Mac or Control+Shift+M on Windows/Linux/Chrome OS.
3. Choose your device preferences (device type, dimensions and zoom level) in the Device Toolbar.
   
4. Click on the More Options icon (3 dots in the Device Toolbar), then select Capture full size screenshot.
   
   Chrome will automatically save a full page screenshot in PNG format to your default downloads folder.

Capture full page screenshot using Developer Tools in Firefox

Available since Firefox version 32, the Take a screenshot of the entire page tool has been available to capture full page screenshots. Here’s how to use it:

1. Open the Developer Toolbox.
   You can do this by clicking the Open Menu icon (Hamburger icon in the top right of the browser), then clicking Developer > Toggle tools.
   
   Alternatively, you can use the shortcut Alt + Command + I on a Mac or Ctrl + Shift + I on Windows/Linux/Chrome OS.
2. Enable the Take a screenshot of the entire page option.
   Do this by clicking on the “Toolbox Options” icon in the Toolbox, then ticking the “Take a screenshot of the entire page” option under the Available Toolbox Buttons options.
   
   This adds a camera icon to the developer tools.
3. Click on the camera icon in the Toolbox to take a screen capture of the entire page.
   
   Firefox will automatically save a full page screenshot in PNG format to your default downloads folder.

from DecoNetwork Blog https://www.deconetwork.com/blog/how-to-take-full-webpage-screenshots-instantly/

Hover your mouse to Deconetwork.com