Automate Website Screenshots – AutoHotKey and FireShot

Brian

9 years ago

I like to keep a snapshot of websites on a daily basis for various reasons. FireShot certainly is one of the best plugins for accomplishing screenshots, but it doesn’t have an automated method inherently built into it. So that’s where AutoHotkey comes into play. AutoHotkey allows you to automate some remedial tasks in Windows.

Use FireShot in Chrome with AutoHotkey to automate screenshots. The scripts can then be automated with Windows Task Scheduler.

Contents

1 Install Software
2 Configure Keyboard Shortcut in Chrome for FireShot
3 AutoHotkey Script
4 Schedule The Script To Run

Install Software

First thing is first, for this tutorial you’ll need a Windows based machine with Chrome installed. Also install AutoHotkey and FireShot. I’m not going to go into detail on how to get there.

Configure Keyboard Shortcut in Chrome for FireShot

The next step is getting Chrome to be able to run FireShot within Chrome via a keyboard shortcut. This is where I ran into the biggest issue – FireShot does allow for setting keyboard shortcuts to various functions via their options. And I was using this in AutoHotkey for the longest time, and then it stopped working and I haven’t fully figured out why. But even using the keyboard shortcut outside of the automation at times seems to not work the best… That’s the reason for using the API like this method suggests.

Create Custom Search Engine

Right-click on the address bar in Chrome and choose Edit search engines….

Scroll to the bottom and find the blank fields to add a new search engine.

The first field is the name of the search engine – this can be anything you’d like.
In the keyword field is where you enter what keyword will trigger the search engine – I sued SaveVisible

The last field is where you put the FireShot API code. So enter this in that field:

javascript: 
 var element = document.createElement("FireShotDataElement");
 element.setAttribute("Entire", "false");
 element.setAttribute("Action", 1);
 element.setAttribute("Key", "");
 element.setAttribute("BASE64Content", "");
 element.setAttribute("Data", "fireshot");

 if (typeof(CapturedFrameId) != "undefined")
 element.setAttribute("CapturedFrameId", CapturedFrameId);

 document.documentElement.appendChild(element);

 var evt = document.createEvent("Events");
 evt.initEvent("capturePageEvt", true, false);

 element.dispatchEvent(evt);

javascript:

var element = document.createElement("FireShotDataElement");

element.setAttribute("Entire", "false");

element.setAttribute("Action", 1);

element.setAttribute("Key", "");

element.setAttribute("BASE64Content", "");

element.setAttribute("Data", "fireshot");

if (typeof(CapturedFrameId) != "undefined")

element.setAttribute("CapturedFrameId", CapturedFrameId);

document.documentElement.appendChild(element);

var evt = document.createEvent("Events");

evt.initEvent("capturePageEvt", true, false);

element.dispatchEvent(evt);

Click Done.

Create Bookmarklet (Optional)

This really isn’t needed for the automation piece, but if you’d like you could create a bookmarklet in Chrome with the same block of code above. This way you can click one button to trigger something different if you’d like.

On the bookmark bar in Chrome, right-click and choose Add page…
In the Name field, choose whatever name you’d like to show on the bookmark bar.
In the URL field enter the block of code above.
Click Save.

FireShot API Options (Optional)

There are a few customizations you can make to the code above.

Line 3 – Entire
- This allows you to specify if you want to capture the entire page or just what is visible.
- Possible Values:
  - true = entire page
  - false = visible portion
Line 4 – Action
- This specifies what action you’d like FireShot to perform.
- Possible Values:
  - 0 – Edit in FireShot
  - 1 – Save to Hard Drive
  - 2 – Copy to Clipboard
  - 3 – Email image
  - 4 – Export to 3rd party editor
  - 5 – Upload to free image hosting
  - 7 – Print
  - 8 – Base64 Encode

File Naming Options

The file name that the image saves as can be customized in the Chrome extension directly. Click on the icon in Chrome and choose Miscellaneous -> Options. Then under Editor options click Click to setup…. Choose Capturing and in here you can setup the file name pattern.

AutoHotkey Script

Now that you have FireShot all setup, it’s time to write an AutoHotkey script that will trigger this. You can use any text editor (Notepad, Notepad++, etc.) to create this.

Create a new file
Save it to any location on your computer with whatever filename you like. The file extension needs to be .ahk

Add this code to the file and save it.

; Open Chrome and focus
Run, chrome.exe, , max
WinWait, New Tab

; Get window ID
WinGet, active_id, ID, A

; Maximize window
WinMaximize, ahk_id %active_id%



; +++ Capture Page #1 +++ ;
;Highlight address bar
SendInput, ^l
Sleep, 2000

; Navigate
SendInput, www.promincproductions.com/blog/{Enter}
Sleep, 11000

;Highlight address bar
SendInput, ^l
Sleep, 2000

;Save visible using a custom search engine that triggers the Fireshot API
SendInput, SaveVisible{Enter}
Sleep, 3000
Send !s
Sleep, 6000
Send {Enter}



; +++ Capture Page #2 +++ ;
; Reactivate window - Minumum should be 4000
Sleep, 10000
WinActivate, ahk_id %active_id%

;Highlight address bar
SendInput, ^l
Sleep, 2000

; Navigate
SendInput, youtube.com/prominc{Enter}
Sleep, 11000

;Highlight address bar
SendInput, ^l
Sleep, 2000

;Save visible using a custom search engine that triggers the Fireshot API
SendInput, SaveVisible{Enter}
Sleep, 3000
Send !s
Sleep, 6000
Send {Enter}



; Reactivate window
Sleep, 4000
WinActivate, ahk_id %active_id%
WinClose, ahk_id %active_id%


; Open the destination directory to leave a trace that this ran
Run explorer.exe C:`,/e

return

; Open Chrome and focus

Run, chrome.exe, , max

WinWait, New Tab

; Get window ID

WinGet, active_id, ID, A

; Maximize window

WinMaximize, ahk_id %active_id%

; +++ Capture Page #1 +++ ;

;Highlight address bar

SendInput, ^l

Sleep, 2000

; Navigate

SendInput, www.promincproductions.com/blog/{Enter}

Sleep, 11000

;Highlight address bar

SendInput, ^l

Sleep, 2000

;Save visible using a custom search engine that triggers the Fireshot API

SendInput, SaveVisible{Enter}

Sleep, 3000

Send !s

Sleep, 6000

Send {Enter}

; +++ Capture Page #2 +++ ;

; Reactivate window - Minumum should be 4000

Sleep, 10000

WinActivate, ahk_id %active_id%

;Highlight address bar

SendInput, ^l

Sleep, 2000

; Navigate

SendInput, youtube.com/prominc{Enter}

Sleep, 11000

;Highlight address bar

SendInput, ^l

Sleep, 2000

;Save visible using a custom search engine that triggers the Fireshot API

SendInput, SaveVisible{Enter}

Sleep, 3000

Send !s

Sleep, 6000

Send {Enter}

; Reactivate window

Sleep, 4000

WinActivate, ahk_id %active_id%

WinClose, ahk_id %active_id%

; Open the destination directory to leave a trace that this ran

Run explorer.exe C:`,/e

return

This script has a few assumptions in it that you may want to change.
- The Chrome custom search engine I put in above is named SaveVisible – change that to whatever name you used.
- This script runs through two webpages and captures the screen – you will want to change those two URLs to whatever sites you wish to capture. Lines 19 & 45.
- After the script has ran, it opens a Windows Explorer window to show that it ran. I set this to the location of where the images were saved. But for this example script it’s set to the root of the C drive. Line 68
  - Note – FireShot will save to the last used folder by default. So keep that in mind and try to use the same folder for this process.

Schedule The Script To Run

Now we can use the Windows Scheduler to run this script moving forward.

Start Button -> Control Panel -> Administrative Tools -> Task Scheduler.
Click Create Task
Set the General tab as you see fit.
Under the Triggers tab, create whatever trigger you wish – I prefer a time based trigger.
Under the Actions tab click New to create a new action.
- Choose Start a Program
- Browse to the .ahk file you created in the above step
Save this task and you should be all set to go!