Breadcrumb

Introduction

This guide shows how to convert to the Universal Theme in Application Express 5. It covers:

  • The Pro and Cons of Universal Theme
  • Migration Steps (Theme Switch Wizard)
  • Post-migration
  • Best practices
  • Common problems and solutions

Please note that this guide assumes you have a working knowledge of Application Express fundamentals.

Pros

Universal Theme has a number of new features, improvements, and optimizations when compared to themes provided with previous releases of Application Express. Additionally, Universal Theme utilizes several key UI features of Application Express 5 and provides a number of new Templates and Template Options that greatly expand the customizability of your application's UI.

Universal Theme provides improvements in almost every facet of defining the User Interface of your applications, and there a number of reasons why it is important to migrate to it immediately. However, you must first understand your users and see whether a drastic change in User Interface is appropriate.

Below is a quick fact-by-fact look at the many reasons for why you should migrate, and the few reasons why you may not want to migrate to Universal Theme.

Improvements

  1. Cleaner Templates

    Universal Theme has fewer, but more capable templates which can be customized with Template Options. It is quicker and easier to modify the presentation by changing Template Options, rather than by having to select a new template. Template Options allow for additional visual flourishes and, in some cases, new functionality.

  2. Improved Grid Support and Responsive Behavior

    Theme 25 introduced Grid Layout support in APEX 4.2, but used a fixed grid which was not easily customizable. Universal Theme introduces a flexible, fluid grid system which can be nested many times over, and is based off the Bootstrap grid.

  3. Mobile Ready

    Because of Universal Theme's improved grid support, applications are responsive out-of-the-box. Therefore, they run well on any mobile device running a modern browser. For example, you will notice that tapping is significantly sped up (no delay in clicking) in Universal Theme apps compared with legacy ones.

  4. Future-proofing

    While legacy and older themes are supported in APEX 5, Universal Theme is the primary theme. With future releases of Application Express you will be be able to readily upgrade the Universal Theme to take advantages of the new functionality provided. Migrating to Universal Theme is a simple means of ensuring your apps provide the most modern and up-to-date user experience for your users.

New Features

  1. Theme Roller

    Older themes required you to to stick with one color and one set of styling. The only means of having your own styling was to override the defaults with CSS or switch to a new theme entirely. Universal Theme addresses this pain point by allowing you to quickly generate a new style for your app, using a GUI.

  2. Navigation Lists

    In Universal theme, you now have the choice between using a top or side navigation menu. Older themes only supported tabs, which always consumed vertical screen real estate. Placing the menu on the side, and allowing it to be collapdsed, works better for most applications, especially when displayed on widescreen monitors.

  3. New UI Components

    Universal Theme has built-in templates for a variety of common UI components which are not available in other themes. For example, there are templates for easily creating carousels, tabs, menus, cards, and much more.

  4. Maximize/Restore

    Universal Theme enables Interactive Reports, Classic Reports, and Standard Regions to be "maximized". With the maximize button template option enabled, end users can now focus on a single region, and scroll through large amounts of data without seeing other content on the page. This makes it far easier for end users to review these large regions which are often very wide and long. Older themes do not have support for this feature.

Cons

Because migrating to Universal Theme, from older themes, will take development effort and significant time reviewing migrated pages, you should consider the downsides of migrating before moving forward.

  1. Different UI
    While Universal Theme is designed to be fully accessible and aesthetically pleasing, users who are completely comfortable with the older theme's UI, may not immediately like the new theme. Further, training material developed in-house will need to be upgraded as the look of the pages will undoubtedly change significantly.

    This is not a technical issue, since Universal Theme is not a departure from the traditional APEX workflow, but an enhancement on top of your existing processes. Application content, such as pages, regions, buttons, and items, will not be changed as a result of migrating, other than their appearance.

  2. Regressions
    Some templates carried over from previous themes may not have strict one-to-one equivalents. Some of your custom CSS/JS modifications that were not directly supported in APEX may also no longer work as expected on your pages. These and other issues are covered in Post-Migration Tasks, Best Practices, and Common Issues After Upgrading sections below.

  3. Custom Themes / Templates
    If you have developed a completely custom theme, then migrating to Universal Theme may require significant effort. Similarly, if you defined custom templates then you may find difficulties finding a similar template in the Universal Theme. However, you may find using the new template options and theme roller will make many of your customizations redundant. If not, you will need to manually define custom templates and reapply your custom CSS and HTML post-migration.