How to Customize the UI in ActiveReports Server

Of the many impressive features that ActiveReports Server boasts, one of my personal favorites is the fully-customizable user interface, allowing for complete color-scheme control of the Server. If you're embedding the Server within your organization’s website or mobile app, you'll be able to maintain a unified, company-wide theme and brand.

If you're embedding the Server within your organization’s website or mobile app, you'll be able to maintain a unified, company-wide theme and brand.

ActiveReports Server comes out of the box with eight different themes that the Server administrator can apply to the Administrator Dashboard and/or Report Portal. The pre-packaged, out-of-the-box color schemes all have different feels to them, and they are great for quickly adding a refreshing touch to your Server. However, if you truly want to give ARS the look and feel of the rest of your organization, you can easily do it with just a few simple steps!

Before you can get started customizing your UI, you must first turn on UI Customization in the Administrator Dashboard. This option is located under Configuration, and then under UI Settings.

Once turned on, you will see three tabs: Common, Report Portal, and Admin Portal. Customize the UI of each by adjusting the settings in each page’s respective tab in this menu.

Under the Common tab, you have the option of setting some site-wide UI customizations. From here, you can specify a URL (such as your own company’s home page) to direct the user to when they click the ‘Help’ button. You can additionally upload a custom logo to replace the default ARS logos on the login screen, the site header, the mobile version, and the favicon.

The Report Portal tab and the Admin Portal tab are identical; the only difference is in which page you're setting themes! If you're following along, you should now take a moment to browse the pre-packaged themes available to you (my favorites are Superhero and Aurora). Upon clicking a preset theme, you'll see a small preview of what your Server will look like once the theme is applied.

I think that it’s best to go ahead and “Save” each theme to get a more realistic feel as to what the theme looks like when it's applied. Hitting “Save” applies the theme to the Server, so make sure you’re in the Admin Portal tab so you can see it without having to go to the Report Portal!

At this point, chances are your company’s color scheme is not one of the eight default themes that come with ARS, and that’s OK! Luckily, our developers made it as simple as A-R-S to change the feel of your Server to make it align with your very own organization’s theme.

You have two areas to customize in terms of color: the Header and the Sidebar. Use the color-picker to find the perfect color for you; click the colored box on the right side of each textbox to select. If you want to have a certain color more than once in your theme, simply copy and paste the color code in the textbox to ensure there's no variance in the colors.

Once you’ve settled on the perfect color-scheme for your organization, click Save, and you'll see the difference for yourself. Now your organization can maintain its brand and enjoy the amazing benefits of ActiveReports Server alongside it!

Try ActiveReports Server

Schedule a live demo