THE HIDDEN GEM
Welcome to a tutorial on how to set up Chrome Kiosk and develop apps for it. Yes, there is a hidden gem called “kiosk mode” in Google Chrome that somehow some developers did not take notice of. It is but a very simple mechanism that sets Chrome into full screen incognito and removes all navigation bars.
That is, we can easily point the Chrome Kiosk to a specially designed website or server within your own network, and that’s it. The project is completed at a very low cost. No need expensive equipment too – Just buy a cheap Chromebook or reuse an old PC to act as the kiosk machine. But just what do we need? How do we develop apps for it? That is what we will walk through in this guide. Read on to find out!
TABLE OF CONTENTS
Kiosk on PC |
Chrome OS Kiosk |
Android/iOS Kiosk |
Useful Bits & Links |
What’s Next? |
KIOSK ON PC
With that, let us start with Chrome Kiosk on the PC – Windows, Mac, or Linux. Just install a copy of Google Chrome first, and here is how we do the magic.
KIOSK MODE ON CHROME BROWSER
If you have not installed Google Chrome Web Browser yet, go ahead, download and install it first. Next, launch the command prompt (or terminal), and run chrome --kiosk "https://your-ninja-site.com"
.That’s it.
Congratulations, you now have a fully functioning Chrome kiosk… Which is pretty much just Google Chrome in full-screen incognito mode. But here are a couple of things to take note of:
- If you are using Google Chrome to browse the Internet right now, you need to close it first (or it will not go into kiosk mode).
- In kiosk mode, there is no way to disable fullscreen, there are no navigation bars, and all the extensions are disabled.
- Please do take note that the OS shortcut keys will still work. You might want to restrict user access to the keyboard on the actual kiosk itself –
alt-tab (command-tab)
to switch to another applicationctrl-shift-escape (option-command-escape)
to fire up the task manageralt-f4 (command-w)
will close Chrome.
CREATING SHORTCUTS (WINDOWS)
It will make more sense to create a shortcut that will fire up Chrome in kiosk mode (rather than typing in the command every time). Here is how to do it in Windows.
First, right-click in an empty folder (or on the desktop) itself > New > Shortcut.
Browse and select where you have installed Chrome, then append the --kiosk "https://your-ninja-site.com"
parameters behind.
Finally, just give the shortcut any name you like. Done – The next time you click on this shortcut, it will fire up Chrome in kiosk mode.
CREATING SHORTCUTS (LINUX & MAC)
“Shortcuts” are slightly different on the Mac and Linux –
- Depending on the build of Linux, things can be different. But we can simply create a new launcher on Ubuntu. Rest of the folks – Try creating a simple shell script.
- The almighty Mac OSX… Not so friendly when it comes to running applications with parameters. Use the Automator and create a “run shell script”.
HOW ABOUT LOCAL APPS?
What happens if you do not have or do not want to run a server? I.E. You only need a standalone kiosk machine. Sadly, Chrome Apps are no longer supported on Windows, Mac, and Linux. So the two alternatives that I can think of are:
- Point Chrome to a local file. For example,
chrome --kiosk "file:///D:/http/index.html"
. But take note that several features will be restricted this way, one of them being AJAX calls. - Set up localhost by installing packages such as XAMPP –
chrome --kiosk "http://localhost/"
. Not that difficult anyway.
CHROME OS KIOSK
A Chromebook or Chrome Tablet is where the kiosk mode will shine most, with rather extensive support and features… Yep, Google did something sneaky here.
WHAT IS CHROME OS? CHROMEBOOK?
Chrome OS is a Linux kernel-based operating system designed by Google. It is derived from the free software Chromium OS and uses the Google Chrome web browser as its principal user interface.
For you guys who have not heard of it… In the layman terms, Chrome OS is like the lesser-known cousin of Android. It is pretty much just Google Chrome as the system interface itself. The whole idea of Chrome OS is to create devices that are specialized for the Internet only.
Laptops that run Chrome OS is known as “Chromebook”, and tablets that run Chrome OS is called “Chrome Tablet”.
KIOSK MODE ON CHROME OS
If you have a Chromebook, here are the compressed instructions from good old Google on how to turn on the kiosk mode:
- Sign in to the Chromebook, open Chrome.
- Enter
chrome://extensions
in the URL to open the extensions screen. Enable Developer Mode (at the top-right corner). - Select “Manage kiosk applications”, then enter the ID of the kiosk app.
Yep, you might be wonder “what app ID”? This is the part where Chrome OS is different from the PC. It runs a local installed Chrome App instead of loading a web page. But do not worry, you can use this Kiosk app to load a web page.
HOW TO DEVELOP CHROME KIOSK APP?
After turning so many rounds, we have finally come to the “develop a kiosk app” part. I shall let the developers themselves explain how it works – How to create your first app on Google. One thing though… Remember that Google removed Chrome App support from Windows, Mac, and Linux?
While they did mention that they will “continue to support Chrome apps on the Chrome OS for the foreseeable future”, we do not know Google’s definition of “foreseeable”. So yeah, I am personally leaning towards creating a “kiosk-like” website instead. Serve both online orders and walk-in customers, kill two birds with one stone.
INSTALLING CHROME OS ON YOUR PC?
Well, you can if you really want to, but Chrome OS is a little confusing for the beginners. So here goes – It is actually based on an open-source project called Chromium OS. You can download the source code, but it does need some yoga before you are able to use it.
So the next easiest recommendation is to get CloudReady – A third-party who made things easier. Take note of the license though, for private use only.
ANDROID/IOS KIOSK
For this final section – It is nothing but bad news. There is no kiosk mode on mobile devices, but there are alternative ways to do it.
APACHE CORDOVA
Aye, there may not be a kiosk mode for mobile Chrome, but we can develop mobile apps using HTML, CSS, and Javascript. If you have not heard of it – Introducing Apache Cordova. As this one is way too long and out of topic for this guide, I will just leave links here if you are interested.
CORDOVA CRASH COURSE
- First, you will need to download and install NodeJS.
- Then follow through the Cordova tutorial on how to create your first app.
- Finally, here is a “Cordova Kiosk mode” plugin that you can use.
USEFUL BITS & LINKS
That’s all for this tutorial, and here is a small section on some extras and links that may be useful to you.
LINKS & REFERENCES
- Chrome Kiosk Mode – Dandelion Burdock
- Here’s How Easy it is to Set Up Chrome Kiosk Mode – Coolheadtech
- Use Google Chrome in Kiosk Mode – Sitepoint
WHAT’S NEXT?
Thank you for reading, and we have come to the end of this guide. I hope that it has helped you to better understand, and if you want to share anything with this guide, please feel free to comment below. Good luck and happy coding!