Figure 1: Userview Properties

ThemeSelect a theme to render the Userview
Mobile View DisabledWhen checked, the Userview will not appear in the listing in mobile view.
DescriptionUserview description meant for developer/admin consumption only to describe the purpose of this element.


Figure 2: Userview Properties - Configure Permission

Hide this Userview in App Center?When checked, this particular Userview will not appear in the App Center's listing.
Permission Type Manage the permission on who to see this Userview. See Permission Control.
Temporarily disable permission checking for testing?

When checked, all permission set to Userview and Userview Category will be bypassed. This is a convenient option for app designer to gain access to all menus for testing.

Important Note

Remember to turn this off once testing is done.

Important Note

This will not bypass permission set inside Form and Form Section.

A red colored label/icon denoting "Permission disabled for testing" will appear on the Userview in the App Center as well as in the Userview runtime itself.


Figure 3: Userview Properties - Login Page UI

Custom HTML (Before Login Form)HTML code is expected here.
Custom HTML (After Login Form)HTML code is expected here.


Figure 4: Userview Properties - Mobile Options

General - Name


Mobile Offline Cache Enabled

When enabled, mobile offline caching capability will be used during offline when possible and when realtime server respond is not required. Network status will be indicated as depicted in Figure 6.
(e.g. User will be able to reopen links/pages in offline mode (as they have been cached) that have been opened before when the user was online)

Mobile Login Required First

Determine whether a user must first login into Joget or not before viewing the Userview.

UI Attribute - Name


Mobile View Background URL

Path to Background image (e.g. http://localhost:8080/background.jpg)

Mobile View Background Color

Background Color (e.g. #FCFDED)

Mobile View Background Style

  • no-repeat
  • repeat
  • repeat-x
  • repeat-y
  • 100% width

Mobile View Translucent Effect


Mobile View Logo URL

Path to Logo image (e.g. http://localhost:8080/logo.jpg)

Mobile View Logo Width

Width of Logo image (unit must be specified) (e.g. 142px)

Mobile View Logo Height

Height of Logo image (unit must be specified) (e.g. 46px)

Mobile View Logo Alignment

Alignment of logo

  • center
  • left
  • right

Mobile View Custom CSS

Inline CSS for further customization


Figure 5: Sample Mobile View Configurations and its preview

Figure 6: Sample Mobile View with Translucent effect

Figure 7: Online status indicator




  • No labels