PROVISIO DevBlog

Specifically Deny Downloads of Certain File Types

SiteKiosk enables you to only allow the download of certain file types only. You can do this in the configuration editor under Files & Downloads. In rare cases you might need to do the opposite, because you only want to block a handful of file types instead of allowing only a handful of file types.

There are two different ways to achieve this. In both cases you would generally allow downloads in the configuration of SiteKiosk under Files & Downloads. Then, one option is to use the Surfing Area settings. Just create deny entries for each file type you want to block. Use * for the protocol and *.filetypetoblock (e.g. *.zip) for the URL. This only works if the download is a direct link to the file.

The second option applies to the IE engine of SiteKiosk only. You can edit the file ..\SiteKiosk\xml\downloadmanager.xml with a text editor (e.g. Notepad). In the file there is a file extension list that already includes a number of default entries. Just add additional entries for the file types you want to block and set both the values for download and for open to 0. Just like this:

<extension name='zip' download='0' open='0'/>

This tells SiteKiosk to neither download nor open the file. Place the entries at the end of the existing list. You may also edit an existing entry. Make sure to not use the same extension twice, SiteKiosk will only use the first match in the list.

<extension-list>
	<extension name='exe' download='2' open='0'/>
	<extension name='dll' download='2' open='0'/>
	<extension name='htm' download='1' open='2'/>
	<extension name='html' download='1' open='2'/>
	<extension name='pdf' download='2' open='1'/>
	<extension name='jpg' download='2' open='2'/>
	<extension name='gif' download='2' open='2'/>
	<extension name='png' download='2' open='2'/>
	<extension name='txt' download='2' open='2'/>
	<extension name='zip' download='0' open='0'/>
</extension-list>

This will block matching download attempts in SiteKiosk.

Using the Blackboard Information Page on a SiteRemote Server

NOTE: This only applies to customers running their own SiteRemote Server (5.2 and above).

The Blackboard is used by the SiteRemote Server and the SiteKiosk Windows and SiteKiosk Android clients to exchange some internal information. There have been two Developer Blog posts (SiteKiosk Windows, SiteKiosk Android) that have shown how this information can be used on a client with the help of the SiteKiosk Object Model. This post will show how to view all available Blackboard information of a single client machine by adding a page to the teams of a SiteRemote Server. This also enables you to easily search the Blackboard information.

Please be aware that the Blackboard information is limited in its use for purposes other than the internal processes of the SiteRemote server and client communication, under specific project circumstances the option to use it might still be very helpful.

To add the Blackboard page to teams on your SiteRemote Server version 6.1 or higher, go to the Settings page of the SiteRemote Server Administration and check the option Show Blackboard information page per machine and Blackboard machine list filter settings on Team settings page. Save the change. Note that in SiteRemote Server version 6.1 or higher, this will also provide you with the option to create your own machine list blackboard filters. Go to the Administration -> Settings page in a SiteRemote team and look for the Machine List Settings. There you can create machine list filters that search through the blackboard entries of machines.

To add the Blackboard page to teams on your SiteRemote Server version 5.2 to 6.0, you need to edit the file ..\PROVISIO\SiteRemote\Web\Web.sitemap. Open it with an editor and look for these lines:

<siteMapNode url="terminal/logs/view.aspx" title="$(String:683)" accesstype="LogFileTab" displayTreeView="true">
	<siteMapNode url="terminal/logs/createexport.aspx" displayTreeView="true"></siteMapNode>
</siteMapNode>

Add this new line directly after:

<siteMapNode url="terminal/blackboard/blackboard.aspx" title="Blackboard" accesstype="LogFileTab" displayTreeView="true"/>

Afterwards you should get this result:

<siteMapNode url="terminal/logs/view.aspx" title="$(String:683)" accesstype="LogFileTab" displayTreeView="true">
	<siteMapNode url="terminal/logs/createexport.aspx" displayTreeView="true"></siteMapNode>
</siteMapNode>
<siteMapNode url="terminal/blackboard/blackboard.aspx" title="Blackboard" accesstype="LogFileTab" displayTreeView="true"/>

If you now login to a team on your SiteRemote Server and select a machine from the treeview on the left, you will have a new Blackboard tab next to the Logfiles tab of that machine.

The page can slightly differ based on the available Blackboard information of that specific machine.

You can now also use the SiteRemote search feature to search the value fields of the Blackboard. To search through the Blackboard use the bs macro. Let's look at an example, the Blackboard contains the current SiteKiosk configuration of a machine in the key CtS.SiteRemote.Config.Files/d/SiteKiosk. If you now want to find all machines that use the www.your-comp.com URL as the start page, you would simply search vor bs:www.your-comp.com and the result lists all machines with that URL in the configuration.

Starting SiteKiosk Windows Chrome Browser with Multiple Tabs

By default SiteKiosk Chrome starts with the one start page you have configured in the SiteKiosk configuration tool under Start Page & Browser. If you need more than one start page, each using its own tab, you can do this with a little bit of script editing.

The editing needs to be done in the file browserSettings.js. The file is located in the folder C:\Users\Public\SiteKiosk\data\content\local\files\projects\d97aa96b962543fcb39625a3f8e8d8fb\000000000000000000000000\files. Make a backup of the file first and then open it with an editor like Notepad or Notepad++.

Look for the first (applies to SiteKiosk 9.5) occurrence of:

tabControl.newTab();

It is the last line (applies to SiteKiosk 9.5) within the definition of the function exports.initializeTabView.

This line opens the start page configured in your SiteKiosk configuration.

To open additional tabs you need to add the newTab function call as many times as the number of tabs you need. Within those additional function calls, you state the starting URL for a tab.

tabControl.newTab({
	startUrl: "https://www.siteremote.net/"
});

For example, if you want to add two extra tabs to the existing start page, you will need this script code:

tabControl.newTab();
tabControl.newTab({
	startUrl: "https://www.siteremote.net/"
});
tabControl.newTab({
	startUrl: "http://devblog.provisio.com/"
});

Please note a few things you should consider when using this customization. If you allow the new window button (Start Page & Browser -> Chrome Browser -> Customize -> Browser Toolbar -> Show New Window Button), new windows will also open with the added tabs. The active tab when loading SiteKiosk or a new window is the last tab in the list. You should not add more tabs than allowed in the SiteKiosk configuration (Start Page & Browser -> Chrome Browser -> Customize -> Advanced -> Maximum number of browser windows/tabs), the default number is 5.

When starting the above example with SiteKiosk the result will look like this:

Customizing the Digital Signage Player of SiteKiosk Windows

Based on the article "Customize the SiteCaster Player in SiteKiosk" (http://devblog.provisio.com/post/2012/01/17/Control-SiteCaster-Player-in-SiteKiosk.aspx) we will examine another scenario for the customization of the Digital Signage player of SiteKiosk Windows.

The example scenario is from a specific customer project and the requirements are as follows ():
1. Digital signage is running in full screen mode.
2. The screensaver (showing the SiteKiosk Player) is allowed and while the screensaver is active, the campaign stops.
3. When the screensaver is deactivated, the campaign needs to be played from the beginning.

This can be useful when having a video playing in the campaign and you do not want any distraction from what you are showing as the screensaver. The requirements can be realized by adding some script to the Digital Signage player of SiteKiosk Windows.

Scripting preparations:
We start by first creating a backup of the file "Start.html" under
"...\SiteKiosk\Skins\Public\ Startpages\SiteCaster".
Then open the file with an editor. It will look like this:

<html>
<head><meta http-equiv="X-UA-Compatible" content="IE=10" />
	<style>
		*
		{
			margin: 0;
			padding: 0;
			border: 0;
			font-family: sans-serif;
			font-size: 1em;
			font-weight: normal;
			font-style: normal;
			text-decoration: none;
		}
	</style>
</head>
<body scroll=no>
	<object id="Player" classid="clsid:719D9061-22DA-4D25-9BB9-116404372496" style="width: 100%;
		height: 100%; position: absolute; background: transparent;">
	</object>
</body>
</html>


Below the <object> tag (and before the closing </body> tag) we now will insert the required script part.
The first entry is for enabling the SiteKiosk Object Model on that page, needed to get the events for screensaver activated and deactivated.

<script>window.external.InitScriptInterface();</script>

The second entry is for loading a script that exposes the SiteCaster player functionality using an API called RequireJS (further information you will find in the article "Customize the SiteCaster Player in SiteKiosk").

<script src="../../External/require.js"></script>


Let’s come to the decisive part of the script.
First we load the "SiteCaster.js" script for controlling the SiteCaster object and ask it to give us a Player object of SiteCaster.

//load our dependent script (in this case it is only SiteCaster.js)
        require.config({
            baseUrl: "../.."
        });
        require(['Scripts/SiteCaster'],
                function (context, siteCaster) {
 
                    //ask it to give us a Player object of SiteCaster
					var player = siteCaster.Player(); …

Before we continue, we make sure that any scheduled campaign is stopped and check that a broadcast is loaded.

//switch off the scheduled playing of the broadcast in case it is activated
player.setAutoSchedule(false);

//check that the broadcast is loaded
player.broadcastLoaded(function () { …

 

Next we ask for all campaign items of the broadcast.

//get all campaign items of the current broadcast
var campaignItems = player.getCampaignItems();


Then we create a variable containing the ID of the first campaign.

//call the first Campaign of the array in the broadcast by id
var ToPlay = campaignItems[0]['id'];


And execute the command to play:

//play the fist campaign
player.play(ToPlay);


This function using the campaignEnd event makes sure that the campaign plays from the beginning again, when it has reached the end:

//play fist campaign again when campaign ends
player.campaignEnd(function (id) {player.play(ToPlay);});


The above just makes sure that our campaign plays in a loop, just as if using a "usual" scheduled campaign. This preparation is necessary for the following part, where we stop the campaign on screensaver start and play the campaign from the beginning, when the screensaver ends.

This script part will fire when the screensaver activates and is using the "OnScreenSaverBegin Event" of the SiteKiosk Object Model (remember we initialized it above) for getting the event.
Then it just uses player.stop(ToPlay);to stop the campaign playing.

//stop playing content when the screensaver activates
SiteKiosk.ScreenSaver.OnScreenSaverBegin = OnScreenSaverBegin;
	function OnScreenSaverBegin() {
        	player.stop(ToPlay);
}


To start the campaign from the beginning, when the screensaver stops, is very similar. It is using the "OnScreenSaverEnd Event" of the SiteKiosk Object Model and starts playing the campaign from start with player.play(ToPlay);

//start playing content when the screensaver deactivates
SiteKiosk.ScreenSaver.OnScreenSaverEnd = OnScreenSaverEnd;
function OnScreenSaverEnd() {
   player.play(ToPlay);
}


When we put all of this together, our page code now looks like this (download: Start.html (2.35 kb)):

<html>
<head><meta http-equiv="X-UA-Compatible" content="IE=10" />
	<style>
		*
		{
			margin: 0;
			padding: 0;
			border: 0;
			font-family: sans-serif;
			font-size: 1em;
			font-weight: normal;
			font-style: normal;
			text-decoration: none;
		}
	</style>
</head>
<body scroll=no>
	<!--object tag to embed the SiteCasterPlayer into the html page-->
	<object id="Player" classid="clsid:719D9061-22DA-4D25-9BB9-116404372496" style="width: 100%;
		height: 100%; position: absolute; background: transparent;">
	</object>
	
	<!--activate SiteKiosk Oject Model-->
	<script>window.external.InitScriptInterface();</script> 
	
	<!-- load a script that exposes the SiteCaster player functionality using an API called RequireJS (http://requirejs.org)-->
	<script src="../../External/require.js"></script>
    
	
	<script>
	//load our dependent script for RequireJS (in this case it is only SiteCaster.js)
        require.config({
            baseUrl: "../.."
        });
        require(['Scripts/SiteCaster'],
                function (context, siteCaster) {
 
                    //ask it to give us a Player object of SiteCaster
					var player = siteCaster.Player();
					
					//switch off the scheduled playing of the broadcast in case it is activated				
					player.setAutoSchedule(false);

					
					//check that the broadcast is loaded
                    player.broadcastLoaded(function () {
					
						//get all campaign items of the current broadcast									
						var campaignItems = player.getCampaignItems();
					
						//call the first Campaign of the array in the broadcast by id
						var ToPlay = campaignItems[0]['id'];
					
						//play the fist campaign
						player.play(ToPlay);
					
						//play fist campaign again when campaign ends
						player.campaignEnd(function (id) {player.play(ToPlay);});
						
					
						//stop playing content when the screensaver activates
						SiteKiosk.ScreenSaver.OnScreenSaverBegin = OnScreenSaverBegin;
						function OnScreenSaverBegin() {
							player.stop(ToPlay);
						}
					
						//start playing content when the screensaver deactivates
						SiteKiosk.ScreenSaver.OnScreenSaverEnd = OnScreenSaverEnd;
						function OnScreenSaverEnd() {
							player.play(ToPlay);
						}
                    
					});
                });
	</script>
</body>
</html>


Configuring SiteKiosk:
In the SiteKiosk configuration you just need to choose the "Player" at Start Page & Browser-->Digital Signage and deactivate the option "Suppress screensaver while playing".


On the Screensaver page, you configure the idle time before activating the screensaver and the content for the screensaver.
In this scenario I have configured the “SiteKiosk Player” with default settings, but you can of course also add other content to the SiteKiosk Player or even choose Digital Signage to display different content than is displayed in the main Digital Signage player.


Publishing the campaign:
To keep it simple for this example, we just publish a campaign with 3 pictures in a row. Of course you can also add any content of your choice, that can be displayed with the Digital Signage feature of SiteKiosk Windows (e.g. a video that will stop playing when the screensaver is activated and plays from the beginning when the screensaver is deactivated).


In the settings of the broadcast make sure you enable the checkbox "Disabled" because the campaign should only start to play when our script from above will execute the play command.


You can also add a second campaign to that broadcast, e.g. to be played during the screensaver, if you select the Digital Signage option on the Screensaver settings page of the SiteKiosk configuration. Make sure to explicitly set this campaign to be displayed during screensaver only and do not tick the "Disabled" option:


Our broadcast schedule for this example will look like this:

Now we publish the broadcast with our campaign:


After publishing the campaign the Digital Signage content displayed in SiteKiosk will always stop when the screensaver activates and start from the beginning when the screensaver will be deactivated.

Charging for Applications Opened from the SiteKiosk Windows Start Screen

In case you want to charge for applications that are started from an element on the Start Screen, you need to start the application using an html link instead of starting the application directly. Please note that only the Start Screen in combination with the IE browser engine allows the usage of payment features.

In the following example we will use Microsoft Word to demonstrate the process. You can apply this to any other application.

First open an editor like Notepad. Copy and paste the following html code:

<html>
   <head>
      <script type="text/javascript">
         <!--
            function StartApplication(){
                  window.external.InitScriptInterface();
                  SiteKiosk.ExternalApps.Run("C:\\Program Files (x86)\\Microsoft Office\\Office15\\WINWORD.EXE", true);
                  window.close();
            }
         //-->
      </script>
      <title>Word</title>
   </head>
   <body onload="StartApplication();">
   </body>
</html>

The SiteKiosk Object Model method Run starts the actual application. Change the path to whatever application you want to start and charge for. Make sure to use double backslashes in the path.

Save the above html code as an html file (e.g. word.html) and put it in the ..\SiteKiosk\html folder. Do the same for every application you want to start from the Start Screen. If for example you want to run 3 applications, you need 3 html files, one for each application.

Now open the configuration editor of SiteKiosk and add your application on the Applications page.

Next configure your payment device(s) and the service rates on the Payment Devices page.

Then switch over to the Start Page & Browser settings. Choose Internet Explorer as the browser engine. Select the Start Screen and click on Customize. In the new dialog go to Start Screen Editor and open the editor. In the template you want to use, add a new element and select Web link instead of Application link.

Add the html file that starts the desired application as a link and make sure to select a matching caption for the element.

For our example we would use file:///C:/Program Files (x86)/SiteKiosk/Html/Word.html.

Create a web link element for each of the applications you want to use.

Now SiteKiosk will charge for starting an application from the Start Screen.

Changing the User Agent of the SiteKiosk Windows Chrome Browser

To complement the 2013 blog post about changing the user agent string for the IE engine of SiteKiosk we will look at doing the same for the Chrome browser engine of SiteKiosk.

Please note, that you can easily add information to the standard user string by using the configuration options of SiteKiosk. Just go to Start Page & Browser -> Chrome Browser -> Customize -> Settings. There you can add SiteKiosk to the user agent header and also a freely customizable string that by default adds the Windows name of the computer ($ComputerName).

If you do not just want to add something to the default user agent you can open your SiteKiosk configuration with an editor. You will find a default setting that looks like this:

"userAgent": {
	"enabled": false,
	"full": "",

Using the default setting will result in something like this (depending on the SiteKiosk version used), when opening the W3Schools test page:

You can change the default values to this:

"userAgent": {
    "enabled": true,
    "full": "Whatever you want SiteKiosk to use as user agent string",

The attribute full is a string that you can copy a standard current or old Chrome user agent string to or any other existing or made up user agent string. Be aware that doing something like this can lead to problems on webpages, as they then assume a browser engine that in reality is not available, causing possible rendering issues.

The effect you will receive from doing the above change can be seen on the W3Schools page again:

Customizing the SiteKiosk Windows Chrome Browser Toolbar

Today we continue looking at options to customize the SiteKiosk Windows Chrome Browser. In last month's post we learned how to easily swap images for the buttons of the browser tooolbar. This time we are going a bit more into the details and learn how to change colors for individual buttons.

Before we start I want to remind you, that there is an even simpler way to change the overall colors of the SiteKiosk Windows Chrome Browser. Just go to Start Page & Browser -> Chrome Browser -> Customize -> Browser Design in the SiteKiosk configuration editor. There you can find 5 color pickers for a quick custom adjustment.

If you scroll down a little bit on that page, you can find an additional section that you can activate to create custom colors for every browser element.

The customizing options provided by the configuration editor are already quite comprehensive. We will be going a step further and change the colors of just one button to make this button standout from the rest and attract the user's attention.

To do that, we need to open and edit a JSON (JavaScript Object Notation) file that is used by the Chrome Browser of SiteKiosk Windows. The file content.json is located in the folder C:\Users\Public\SiteKiosk\data\content\local\files\projects\d97aa96b962543fcb39625a3f8e8d8fb\000000000000000000000000. Open it with an editor like Notepad++.

For the purpose of this demonstration we will continue to edit the individual button that you can configure on the configuration page for the Chrome browser toolbar: Start Page & Browser -> Chrome Browser -> Customize -> Browser Toolbar. In the content.json file look for this line:

"type": "content-custom-button-container",

This is the start of the definitions for the individual or custom button. A few lines down we can find a segment that looks like this:

"icon": {
	"src": "files/images/custom.svg",
	"color": "[[$root.colors.toolbarButton.icon]]",
	"hoverColor": "[[$root.colors.toolbarButton.iconHover]]",
	"pressedColor": "[[$root.colors.toolbarButton.iconPressed]]"
},
"backgroundImage": {
	"color": "[[$root.colors.toolbarButton.background]]",
	"hoverColor": "[[$root.colors.toolbarButton.backgroundHover]]",
	"pressedColor": "[[$root.colors.toolbarButton.backgroundPressed]]"
},

icon defines the image used for the button and the caption. src is the relative path to the image file so you can use your own image file without overwriting the existing one, color is the default color of the caption of the button, hoverColor is the color used when hovering the mouse over the button and pressedColor is used when the button is being clicked.

backgroundImage defines the colors for the background of the button. Again color is the default color of the caption, hoverColor is the color used when hovering the mouse of the button and pressedColor is used when the button is being clicked.

To assign your own color selection you can use the common notation format for colors: #FF9EDD.

Here is what an edited version of the above segment can look like:

"icon": {
	"src": "files/images/mycustom.svg",
	"color": "#FF9EDD",
	"hoverColor": "#BC7E87",
	"pressedColor": "#AE0000"
},
"backgroundImage": {
	"color": "#FFBE70",
	"hoverColor": "#FF8B51",
	"pressedColor": "#FF2600"
},

If you now prepare a configuration that includes an individual button you will get this result:

This is how the button looks by default:

Feel free to experiment with the values to create a custom browser experience that matches the needs of your kiosk project.

Using Custom Icons for SiteKiosk Windows Chrome Browser Buttons

In the last post we took a look at a method to add more than two custom buttons to the SiteKiosk Windows Chrome Browser. This time we will learn how to change the button icons to create an individual browser experience.

Note that you can easily change the general appearance of the SiteKiosk Windows Chrome Browser through the SiteKiosk configuration. Just go to Start Page & Browser -> Chrome Browser -> Customize -> Browser Design. Here you can change the colors of the different browser elements.

If you want to go a step further in customizing the SiteKiosk Windows Chrome Browser, you could use individual icons. All icons used by the browser can be found in the folder C:\Users\Public\SiteKiosk\data\content\local\files\projects\d97aa96b962543fcb39625a3f8e8d8fb\000000000000000000000000\files\images. They are available as scalable vector graphics (.svg format). As with every change you make to an existing application, you should make a backup of the original file. We will be using the icon for the custom buttons as an example to demonstrate the process.

You can use the original file as a starting point to create your own icon. Open the .svg file with an appropriate editor like Inkscape and change it the way you want the icon to look. In our example we repaint the custom.svg to this new icon:

If we now open the SiteKiosk configuration editor and go to Start Page & Browser -> Chrome Browser -> Customize -> Browser Toolbar to configure a custom button that links to http://www.sitekiosk.com, the result will look like this:

You can apply the same process to any of the existing icons for SiteKiosk Windows Chrome Browser.

Adding More Than Two Custom Buttons to the Chrome Skin of SiteKiosk Windows

Using the SiteKiosk configuration, you can add two custom buttons to the toolbar of the Chrome Browser in SiteKiosk Windows. In case your kiosk project requires more than two, you can add additional buttons by manually editing your SiteKiosk configuration file.

Start by creating a configuration with the default option of two custom toolbar buttons. Go to Start Page & Browser -> Chrome Browser -> Customize -> Browser Toolbar. Scroll down to the Individual Buttons section and edit the two buttons to your liking. When you are done, save the configuration.

The next step is to open your configuration with an editor like Notepad or Notepad++. SiteKiosk configuration files can usually be found in the ..\SiteKiosk\Config folder.

In the editor, search for customButtons. Your search will lead to some lines, that look similar to this:

"customButtons": {
	"button1": {
	  "caption": "Button 1: Open www.provisio.com",
	  "action": "openLink",
	  "url": "http://www.provisio.com/"
	},
	"button2": {
	  "caption": "Button 2: Toggle Onscreen Keyboard",
	  "action": "toggleOnscreenKeyboard",
	  "url": "file://"
	}
}

The customButtons section includes two entries for the individual buttons that have been created in the configuration, button1 and button2. The caption value contains the caption of a button, the action value contains one of the seven available actions for a button and the url value contains an optional URL if the openLink action has been selected, otherwise the default value is file://.

Available actions are as follows, the names speak for themselves:

"action": "shutdownWindows",
"action": "restartWindows",
"action": "logoffWindowsUser",
"action": "restartSiteKiosk",
"action": "showPasswordDialog",
"action": "toggleOnscreenKeyboard",
"action": "openLink",

Note that using toggleOnscreenKeyboard requires that you have configured one of the available On-Screen Keyboards in the SiteKiosk configuration, showPasswordDialog requires that you did not choose the option to not use a password to close SiteKiosk.

Adding an additional individual button is pretty straight forward. Create a new button entry named button3 (button4, button5, etc.) and set the caption, action and url (if the action is openLink) values. Basically you should get something like this:

"button3": {
  "caption": "Button 3: Logoff Windows User",
  "action": "logoffWindowsUser",
  "url": "file://"
}

If a button entry is not the last one, you need to add a comma after the closing curly bracket, e.g.:

"button3": {
  "caption": "Button 3: Logoff Windows User",
  "action": "logoffWindowsUser",
  "url": "file://"
},

Here is an example of a  modified version of the customButtons section with four individual buttons:

"customButtons": {
	"button1": {
	  "caption": "Button 1: Open www.provisio.com",
	  "action": "openLink",
	  "url": "http://www.provisio.com/"
	},
	"button2": {
	  "caption": "Button 2: Toggle Onscreen Keyboard",
	  "action": "toggleOnscreenKeyboard",
	  "url": "file://"
	},
	"button3": {
	  "caption": "Button 3: Logoff Windows User",
	  "action": "logoffWindowsUser",
	  "url": "file://"
	},
	"button4": {
	  "caption": "Button 4: Restart Windows",
	  "action": "restartWindows",
	  "url": "file://"
	}
}

If you save the above example as part of a SiteKiosk configuration and start SiteKiosk with it, you will get this result:

For the purpose of this screenshot, most of the default toolbar buttons have been disabled in the SiteKiosk configuration.

Please also keep in mind, that every additional custom button, beyond the two default individual buttons, will not be visible in the configuration editor of SiteKiosk. Changes need to be done in a text editor.

How to Remove the Progress Bar in the SiteKiosk Chrome Browser

Today we are looking at a quick way to remove the progress bar in Chrome browser windows of SiteKiosk Windows. Please note that this feature will most likely be added to a future version of SiteKiosk for the Chrome engine skins.

To achieve the task we need to edit a file of the Chrome Browser skin. The content.json file is located in the folder C:\Users\Public\SiteKiosk\data\content\local\files\projects\d97aa96b962543fcb39625a3f8e8d8fb\000000000000000000000000. Open it with an editor.

Look for the segment that starts with this line:

"type": "content-webview-progress",

This will lead you to this:

{
	"type": "content-webview-progress",
	"name": "loadProgress",
	"borderBottom": "1px solid transparent",
	"borderBottomColor": "[[$root.colors.border]]",
	"backgroundColor": "[[$root.colors.progress.background]]",
	"height": "7px",
	"paddingTop": "2px",
	"paddingBottom": "2px",
	"width": "100%",
	"color": "[[$root.colors.progress.foreground]]",
	"webView": "{{tabPageArea.currentTab}}",
	"_editor_canBeSelected": true,
	"_editor_canBeEdited": true,
	"_editor_canBeDeleted": true,
	"_editor_canAdd": true,
	"layout": {
	},
	"_editor_propertiesToEdit": {
		"applyToAllContentGroups": true,
		"flex": true,
		"margin": true,
		"text": true
	},
	"_editor_propertiesToEditRestrictedUser": {}
},

Within the segment look for the line:

"width": "100%",

Add the following line directly after:

"visible": false,

The edited segment should look like this now:

{
	"type": "content-webview-progress",
	"name": "loadProgress",
	"borderBottom": "1px solid transparent",
	"borderBottomColor": "[[$root.colors.border]]",
	"backgroundColor": "[[$root.colors.progress.background]]",
	"height": "7px",
	"paddingTop": "2px",
	"paddingBottom": "2px",
	"width": "100%",
	"visible": false,
	"color": "[[$root.colors.progress.foreground]]",
	"webView": "{{tabPageArea.currentTab}}",
	"_editor_canBeSelected": true,
	"_editor_canBeEdited": true,
	"_editor_canBeDeleted": true,
	"_editor_canAdd": true,
	"layout": {
	},
	"_editor_propertiesToEdit": {
		"applyToAllContentGroups": true,
		"flex": true,
		"margin": true,
		"text": true
	},
	"_editor_propertiesToEditRestrictedUser": {}
},

Save the file and start SiteKiosk to see the effect.