How to include online content in your help (HTML)

You can also use online help by conditionally showing an iframe if the user is online. In this example, a toggleHelp function is designed to conditionally show or hide two divs, based on whether a user's computer is online or offline. The function could be loaded into the help page either on Body load or button click (user taps Help).

Instructions

Step 1: Add a function to toggle help depending on whether the user is online.

function toggleHelp() {
    var onlineDiv = document.getElementById("onlineHelp");
    var offlineDiv = document.getElementById("offlineHelp");
    var condition = ((navigator.onLine) ? 'online':'offline');
    if (condition=='online') {
        onlineDiv.style.display = "inline";
        offlineDiv.style.display = "none";
    }
    else if (condition=='offline') {
        onlineDiv.style.display = "none";
        offlineDiv.Style.display = "inline";
    }
}

Step 2: Add the online and offline divs and an iframe to show online content in your help page.

<div id="onlineHelp">
    <iframe src="ms-appx://LinkToOnlineHelpPage" frameborder="0" sandbox=""/> 
</div>

<div id="offlineHelp"> 
    It looks like you’re not connected to the Internet. 
    You need to connect in order to get help.
</div> 

App settings sample

Guidelines for app help