Accountability Dashboard Pages

Owned by Rachel Klingler
Last updated: Jan 18, 2019
2 min read

This page outlines the contents of an Accountability Dashboard page.

Normal Page Outline

Intro Text

Most pages start with intro text. This includes all the text before the first [uwsa_row ] shortcode. Some pieces of this text are hidden and only displayed in certain contexts. This is done by surrounding the text with a <div > element and specifying a class. To edit the divs and classes, you must use the text tab of the editor.

The classes used are:

  • "screen-reader-text": This text will not be displayed visually, but will be read by a screen reader.
  • "visible-xs" and "visible-sm": This text will only be displayed on small screens where the dashboard does not fit horizontally.
Access includes total enrollments, where students come from, participation of Wisconsin high school graduates, new transfer students, and access for underrepresented and lower-income students.

Measures of performance and success should be viewed through the lens of institutional ...
<div class="screen-reader-text">The following document is a screen-reader accessible alternative to the dashboard on this page:[wpfilebase tag=file id=14 tpl=minimal /]</div>
<div class="visible-xs visible-sm">The dashboard below is designed for viewing on larger screens. On some devices, you may be able to scroll left and right to view obscured content.</div>

Rows and Columns

The dashboard is typically displayed on the left side, with a nav menu to it's right. To make the two columns, the [uwsa_row ] and [uwsa_column ] shortcodes are used. These must be closed at the end of the page. For more information, see Bootstrap Row and Column Shortcode. In short: columns need to be inside rows. The width attribute is out of 12.

[uwsa_row no_col="true"][uwsa_column width=10 size=lg ]

Dashboard Shortcode

The dashboard shortcode embeds the dashboard. For more information see the Dashboard Shortcode page.

[dashboard file="dashboard" url="https://public.tableau.com/views/UWAccountability-Access/Access" width="100%" height="679px"]

Technical Notes

The technical notes are added with a [uwsa_modal ] shortcode. [/uwsa_modal] marks the end content in the pop up window. See Modal Shortcode for more information.

[uwsa_modal title="Access" button="Technical Notes" buttonsize="sm" si_params="'dashboard','open Technical notes','Technical Notes - Access'" ]
<h6>Fall enrollments by headcount and FTE</h6>
Enrollments consist of all students enr...
[/uwsa_modal]

User's Guide PDF

The How-To PDF is embeded with the [wpfilebase ] shortcode. This can also be added via the Site Files button in the editor toolbar.

[wpfilebase tag=file id=9 tpl=minimal /]

Navigation Column

The dashboard column is closed and the navigation is added. Then, the navigation column is closed and the row is ended.

The navigation is a Reusable Content block embedded via the RPS Include Content shortcode. It can be edited by navigating to Collections > Reusable Content. The Dashboard Topics use the "Icon Menu" reusable content (id = 400), and the Accountability Areas use the "Accountability Areas Menu" reusable content (id = 402). Blog should always be id 236 (Accountability Dashboard).

[/uwsa_column][uwsa_column width=2 size=lg] [rps-include blog=236 page=400 ]

[/uwsa_column][/uwsa_row]

Notes

  •  We have found that the the Tableau Dashboard embeds work better in the Classic Editor tab instead of using Zuse Create.
  • If we added another dashboard, we'd need to add links in the following areas:
    • Homepage
    • Sidebar Menu (via the Reusable Content)
    • Main Red Menu (via Collections > Menus)
    • List of Measures page
  • The institution highlights page is built with Zuse Create and the UW System Roster module.
  • The dashboard topics menu on the homepage and sidebars make use of the Tooltip Shortcode.