Adding "Help" Content to Mobile Forms

 

About

Adding "Help" content to forms gives mobile users access to support and other resources out in the field.  Help content is available to users through a button embedded beside a question.  Any question in the form can include a link to Youtube videos, web pages, or HTML-formatted work instructions.

 

Add Help Content to a Question

  1.  Mouse over the question and select Edit Properties.  
  2. Click on the Help Properties tab.
    help4.png
  3. Select a Help Type
    • Youtube Video: Link to a "Help" Youtube video
    • Web Link: Brings users to a web page
    • HTML Text:  Enter work instructions,  tips, etc.  This text can be formatted to include different font sizes, lists, tables, images and more.

Note:  Viewing external links (Youtube Videos, Web Links)  requires a device with internet access.  HTML Text help does not require internet access unless it includes images. Read below for information on using images in HTML help for users who may be working offline.

When linking to external sites and/or files using help links, we recommend using HTTPS due to iOS' built-in security preventing any non-HTTPS links from being initialized from a third-party app.

[ top ]

 

Images in "Help" Text: Working Offline

The "HTML Text" content option functions offline. Users will still be able to use the help content when they do not have a network connection.  However, the editor for this content only allows images to be loaded by referencing an image URL.  Images added to the "help" content in this way will not load when users are working offline.

If images are base64 encoded and included in an HTML image tag, they can still be read in the "help" content when working offline.  Use a base64 encoding tool like this: https://www.base64-image.de/ . Upload an image to this tool, and it will translate it into a base64 string.   Ensure you include the HTML tag for an image (see below). Depending on the HTML of the rest of your help text, you may need to add <div> </div> tags around the HTML image tag.

Sample base64 string with HTML image tag:

<div><img alt="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAIAAAACDbGyAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAfSURBVBhXY/j//z8DGAAZcDYUYOPDxUCqIXwE+P8fAL3KJtp7Qq5LAAAAAElFTkSuQmCC" /></div>

 

To add images that will load when working offline:

  1. In the "Edit Properties" screen of the desired question, enter the "HTML Properties" tab.
  2. Select "HTML Text" as the help type.
    HTML_Help.png
  3. Copy and paste the HTML image tag with the base64 string.  
    HTMl2.png
  4. Click "Update" and save the form.

[ top ]

 

 

On a Mobile Device

A question with any kind of "Help" associated with it will have a question icon to the right.  Click this for help.

   help_button.png

This will open up the help information box as shown below, which may include text, image and video linking capabilities:

help3.png

[ top ]

Was this article helpful?
2 out of 2 found this helpful
Have more questions? Submit a request

Comments