Rich Text Menu

The Rich Text UI element in Joget allows you to create custom pages using a rich text editor or by directly writing HTML, CSS, and JavaScript. This guide provides instructions on effectively utilizing the Rich Text Menu within your application.

#requestParam.id?javascript#

Configure rich text

To configure Rich Text properties, in UI Builder, drag and drop the Rich Text element onto the canvas and click on it.

When adding Rich Text, you will see the following fields available for configuration:

• Label: The Rich Text menu label.
• Menu ID: Item link slug. Optional field.
  Ensure that the value defined here is unique to other UI menus in the app since the first matching/conflicting ID will take precedence in page loading.
• Content: Editable field where you can input the page content using the rich text editor or raw HTML/CSS/JS.

Performance & offline

The Performance & Offline settings in the Rich Text Menu allow you to enhance your application's performance by caching the content of the rich text element and supporting offline usage. Properly configuring these settings can improve the user experience by reducing loading times and enabling access to the content without an internet connection.

Cache Settings

The Cache Settings for the Rich Text Menu determine how the content is cached to improve performance. 

Fields to Configure:

• Scope:
  Options include are: 
  
  • None: No caching.
  • Application: Cache content by application where all users will see the same content.
  • User: Cache by username.
• Duration (s): Duration in seconds to cache content defaults to 20 seconds if applicable.

For more information, see Performance Improvement with UI Caching.

PWA offline settings

The PWA Offline Settings enable you to cache the rich text content for offline support, which is particularly useful for mobile browsers. This option lets users access the rich text content offline, ensuring a seamless experience. See Progressive Web Application (PWA) documentation for more details.

Field to Configure:

• Enable cache for offline support: Enable caching for offline support. This is usually set for mobile browsers.