SecuritySpy has a built-in web server that allows remote viewing of live camera streams as well as access to previously-captured footage and settings. We sometimes get asked by customers how to customise the appearance of these web pages for various reasons, such as to change colours, add branding, modify text etc. The procedure is quite simple, though it does require some knowledge of HTML and CCS.
All the files used for SecuritySpy’s web interface are stored within its application bundle. Right-click on the SecuritySpy application icon and select Show Package Contents.
Within the SecuritySpy application bundle, navigate to Contents/Resources/English.lproj/Web/ – all the files SecuritySpy uses for its web interface are stored here.
It’s important that you don’t modify these files directly; instead, for any file that you want to customise, copy it to the ~/SecuritySpy/Web/ folder. To get to this folder, click the Go menu in the Finder, select Home, then navigate into the SecuritySpy folder. (Note: in older versions of SecuritySpy, the location of this folder is ~/Documents/SecuritySpy/Web/).
Then, modify the file in this user location. When SecuritySpy looks for a resource to deliver via the web server, it will first check this user location, and if the file doesn’t exist there, it will use the file from its application bundle web folder.
Here are some of the main files used in the web interface:
- index.html – the main page that is displayed when opening the web interface
- live.html – the page that displays the live camera feeds
- download.html – the page that displays the list of captured footage
- mainlogo.png – the image that is displayed at the top of the main page
There are settings pages too, but these change from time to time with SecuritySpy software updates, so it’s not recommended that you create your own.