UPCOMING WEBINAR: Run Research Your Way With AI Skills Register now >>

Articles in this section

Customizing Online Reports/Dashboards

  • Updated
Follow

When designing a report or dashboard, there are elements of the design that you should consider before beginning to avoid rework later on. There are lots of different ways of customizing online reports/dashboards, in terms of both functionality and appearance. This article describes the following:

The appearance of tables and visualizations

There are many ways of customizing tables and visualizations, by modifying the data, how the data is calculated, styling, rules, visualization types, and so on. As an example, compare the two dashboards below.

See Create and Customize Tables and Data Visualization for more information.

mceclip0.png

mceclip1.png

Navigation

Navigation refers to how a user moves between pages in a document when in view mode. You can customize navigation by:

  • If using a navigation pane, by:
    • Creating folders, by dragging pages onto other pages or via the + menu in the Report tree.
    • Hiding pages, to remove the Page from the Dashboard, see How to Hide and Unhide Items.
  • Hiding the navigation pane, which is the list of pages shown on the left side of a document. This is hidden by clicking Share > Publish to web > Advanced Options > Hide navigation pane and then Publish/Republish.
  • Creating links to published pages (i.e., those that are not Hidden via the menu in Edit Mode). Note that if you hide the navigation pane, you will need to create links within the design of your Dashboard to be able to navigate the Report in view mode.

Filters

Filters created when editing a document are available when the document is being viewed. 

mceclip0.png

Additionally, controls can be added to pages. For example, a combo box is shown below.

mceclip1.png 

See Create and Apply Filters for more information.

Controls

In addition to being used to filter data, controls can be used to create other forms of interactivity, such as changing which data is viewed and creating simulators. See Work with Controls for Interactive Outputs for more information. 

Explore mode

Explore mode allows viewers of online reports/dashboards to create their own tables using the raw data. See How to Enable Explore Mode.

Page master template

Like the Slide Master in PowerPoint, you can use the Page Master to customize page layouts to use as templates when creating your report. In it, you can add background images, set default colors, standard text boxes, and editable placeholders that position and style your outputs. See How to Create a Template Document. You can even save these configurations as templates that you can reuse in other documents, see How to Add Your Own Document Template to the Gallery.

Add Shapes, Images, Media, and other Design Elements

You can add other design elements to improve the readability and format of your dashboard. See our Add Shapes, Icons, Images, and Symbols section for further examples. You can insert and format static Text boxes even inside shapes and callouts. Inserting custom dynamic text boxes and sample size descriptions enables you to create commentary that updates alongside your data. Given outputs on a page, you can arrange and align them automatically. You can also Hide individual supporting outputs or entire Pages from being published to the Dashboard.

Custom HTML

You can add custom HTML onto a page using a calculation, as follows:

  1. Press Calculation26UI_Calculation.png > Custom Code from the toolbar.
  2. Click on the page to place the object.
  3. In the Code 26UI_CodeEditor.png panel, paste in the following code, replacing <b>dog</b> with whatever HTML you wish to use.
  4. Press Calculate.
rhtmlMetro::Box("<b>dog</b>", text.as.html = TRUE)

Typically, rather than just typing HTML, it is more useful to write the HTML using code. For example, see How to Hide an Output with a Small Sample Size Using a Calculation.

More advanced customization via the CSS

You can also modify the appearance of an online report/dashboard by modifying the CSS (cascading style sheet). For example, see:

Please note: While those articles can serve as guides, our support team cannot help with custom CSS coding, as it is well outside of our expertise

Next

PowerPoint/Excel/PDF Report Creation and Automation

Related articles