Customizing App Center

Introduction

Explore the power of Joget by setting any user interface (UI) from any app as your default UI. This functionality turns your chosen UI into the gateway for users accessing Joget, enhancing user experience with a customized entry point. Follow this guide to learn how to specifically configure and personalize the App Center as your default UI.

Assigning default UI as the app center

In Joget, you can designate any UI from any app as the default user interface (UI). The default UI acts as the landing page users first see when navigating to Joget.

By default, the installation includes App Center with a UI called Landscape, which is set as the initial default UI.

Overall structure of app center app

Unlock the full potential of the App Center by customizing its appearance and functions to meet your needs:
The default App Center app in Joget can be fully customized to suit your organizational needs better. Here are the steps to modify its structure:

1. In the App Center, login as an administrator.
2. Select the pencil icon located at the bottom right of the screen.
   
3. Go to All Apps from the admin bar.
4. Select the App Center app to proceed.
   
5. Click App Center to access the UI for editing.
   
6. In the UI Builder, edit the UI menu called Home.
   
7. It is a List UI Menu that points to a JSON API named Published Userviews.
   By defining the content of the form, we can alter the JSON URL. 

Customizing the app center's UI

To personalize the appearance of the App Center in Joget, you can change various elements such as the logo and the home banner, and apply custom CSS. Additionally, you have the option to disable the help guide feature. Follow these steps to implement your customizations:

1. In the UI Builder of the App Center, go to Settings > Theme > Advanced.
2. Upload a preferred logo to the app's Resources.
3. After uploading, copy the newly generated hash variable of the resource.
4. Substitute the existing image source with the new resource's hash.
   
5. Within the same Advanced settings where you upload the logo, you can modify the Home Banner and add Custom CSS. This allows for further visual customization of the App Center.
   
6. The help guide feature can be disabled by scrolling to the bottom of the same page.

Disabling the "help" (Hint/Guide) 

1. To disable the Hint pop-up, edit the App Center UI.
2. Navigate to Settings.
3. Under Settings, navigate to "Configure Layout > Configure Theme > Advanced".
4. Scroll down to the bottom of the page and check the "Disable help guide feature?" option.
   

5. Then click Save to save the UI.

Related documentation

• Apps and the App Center