You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 4 Next »

Assigning Default Userview as The App Center

Any Userview from any apps can be used a the default Userview. The default Userview here serves as the landing page when someone visits Joget Workflow.

In the default installation, an app called "App Center" with the Userview named "Joget Workflow" is preloaded in

Overall Structure of App Center App

The default App Center app can be customized towards individual's preferences.

  1. In order to edit it, simply heads to "All Apps" as the administrator. Click on "App Center" app.
  2. Then, click on "Joget Workflow".
  3. In the Userview Builder, edit the only menu that you see in it.
  4. It is a form menu that points to the form named "Published Apps".

    By defining the content of the form, we will be able to alter the content of the default app center. Simply return to step 2 above and open up the form.
  5. In the form's design, there are 2 custom HTML elements.

    The first one (highlighted in red) is meant to be shown when a user of administrator role logs in. The second one (highlighted in blue) is to be shown all the time.

  6. Edit the second Custom HTML to reveal its code.

    <link rel="stylesheet" href="/jw/css/appCenter.css" />
<div id="main-action-help"><i class="fa fa-info-circle"></i></div>
<div id="search"></div>
<div id="apps"></div>
<p>
<script src="/jw/js/appCenter.js"></script>
<script>
AppCenter.searchFilter($("#search"), $("#apps")); 
AppCenter.loadPublishedApps("#apps");
</script>
</p>



Customizing the App Center's Userview

  1. The logo that is displayed in the App Center can be changed under Userview Builder's settings > Logo URL.


  2. The "Home Banner" and "Custom CSS" can be cuztomized.
  3. The help guide feature can be disabled in the same page too.

 

Customizing the App Center's Form

<link rel="stylesheet" href="/jw/css/appCenter.css" />
<div id="main-action-help"><i class="fa fa-info-circle"></i></div>
<div id="search"></div>
<div id="apps"></div>
<p>
<script src="/jw/js/appCenter.js"></script>
<script>
AppCenter.searchFilter($("#search"), $("#apps")); 
AppCenter.loadPublishedApps("#apps");
</script>
</p>

 

  1. Line number 2 can be removed to remove the "help guide" icon.

 

  • No labels