About

This theme is the product of a collaboration between University Marketing and the Integrated Applications (IA) team at DoIT. It evolved from needs and demand that arose from the redesign of the wisc.edu site in January 2016. It represents more visual flexibility than the UW Theme Lite, all while adopting current best practices in WordPress theme development, as well as CSS, Javascript, HTML and accessibility. This theme offers a solid, responsive design solution out of the box.

The UW themes are copyrighted by the Board of Regents of the University of Wisconsin System.

Browser Compatibility

The UW Theme supports the latest versions of all major web browsers, including Microsoft Edge, Firefox, Chrome, Safari, and Internet Explorer 11 — this also includes mobile optimization and compatibility with current versions of these browsers.

Although we recommend you use the latest version of any browser, the UW Theme is expected to perform well on older versions if they’ve been released within a couple years. With the exception of Internet Explorer, modern browsers auto-update, so most users are running the latest version of a browser.

When it comes to Internet Explorer, the UW Theme is well supported in IE 10. The theme works in IE9, but does contain some layout issues. However, in IE8 the theme is generally not usable. If you’re experiencing issues with IE11 or IE10, ensure you’re not operating within IE’s Compatibility Mode. In all cases, it’s always best to use the latest version of your browser of choice for security and usability reasons.

The UW Theme is also designed to work in various combinations of assistive technology and screen readers. See the theme’s accessibility standards. In particular, the development team has done at least basic testing with NVDA on Windows running IE11 and Firefox; VoiceOver on OSX and Chromevox.

Using the theme

After downloading and unzipping the theme, install it in your site’s themes folder and activate through your admin dashboard.

Using a child theme

If you want to extend the theme, you should use a child theme. Do not edit the theme files themselves. If you do so, you will lose those changes when upgrading the theme in the future. See the WordPress documentation for Child Themes.

Customizing the theme options

Use WordPress’s Customize screen to set options for the theme. The options that can be set include:

Colors and Typography: You can switch between a light grey or white page background. You can reverse the red and white background colors of the top global menu bar and the main menu bar. The theme uses the Verlag font face, which is now widely used in campus communications, most notably on wisc.edu.

Menus: The theme supports up to three different menus areas out of the box: the main menu, the secondary menu (which appears in the top menu bar) and two footer menus (which appear as lists of links in the footer under a heading corresponding to the menu name.) The Main and Secondary menus support one level of child, dropdown menus (though we recommend avoiding dropdown menus altogether if possible and instead trying to define a site information architecture that clearly leads your users through your site’s content hierarchy.) See below for more details about setting footer menus.

Widgets: There is one “widgetized” area in this theme: the sidebar. By default, the sidebar will use some of WordPress’s standard widgets (e.g. Meta, Archives, Blogroll). Widgets can be added, removed or rearranged to suit your needs. (The Custom Menu widget can be a handy way to add a list or lists of links to your sidebar.)

Static Front Page: This exposed WordPress’s built-in option for choosing a page you publish to serve as the front page of your site (instead of showing your most recent posts, which is the default). You first publish a page with content you want to include and then select that page through this option.

Footer: The footer options allow you to set an address, map URL, email and phone number, as well as a variety of social media URLs that will appear in your site’s footer. You can also specify up to two footer menus. You first need to create the menus in the menu manager (the menu name you choose will be used as the header in the menu) and then select them in the Footer options. It’s best to include between 4–8 items in each menu if you use them.

Search options: The search options allow you choose whether to include search on the site, as well as a new option to use Google Search by default instead of the native WordPress search. If you prefer to use a Google Custom Search Engine, you may enter its GCSE ID. See KB doc for help with setting up a Google Custom Search Engine.

Analytics: This option allows you to include your Google Analytics Tracking ID.

Breadcrumbs: The breadcrumbs option allows you to turn breadcrumbs on or off by checking a box. Breadcrumbs are a way-finding tool. They are the smaller links at the top of the page that show your users where they are in your site.

Developing with the theme

Web developers who use the theme can work with it in a number of different ways:

As a child theme

As with any WordPress theme, you can create a child theme if you want to extend or override its functionality beyond what is possible using the theme customizer. See the WordPress documentation for Child Themes for documentation. The theme does provide a few hooks (see WordPress docs) that might be useful:

If you have suggestions for additional filters or action hooks, please contact us or consider contributing to the theme’s development (see below).

Customizing CSS

CSS customizations should be done within a child theme. The theme’s source code (not included with the zip download) includes the Sass files used to compile the theme’s CSS. If you’re working with the source code (see below), you can selectively compile in the theme’s source Sass as needed (including variables and a limited number of mixins). The theme’s source includes a Bower dependency for UW Style which is a set of Sass files and some Javascript that University Marketing is developing for use in any website or web app. This will be documented more in the future; for now, please direct questions to wordpress@umark.wisc.edu.

Getting the source code

The zip download includes only the files needed to run the theme. The theme’s source code is stored in the campus’s Gitlab service, which is maintained by DoIT. To clone or fork the project, login to git.doit.wisc.edu via Shibboleth and visit UW Theme. The project README file includes instructions for how to build a local development environment. The source code includes only the theme; you will need to download or compile WordPress core into your project in whatever way you prefer.

Contributing to the project

Reporting issues and requesting features

Please use the GitLab Issues tool inside the project to report issues and/or feature requests.

Contributing code

We welcome contributions to the code. To contribute, fork the repository, create a branch for your contribution, make and commit your code changes, push your branch to git.doit.wisc.edu and then make a merge request when you are ready. Please try to first submit an issue and let us know you’d like to work on it before submitting the merge request. Please keep merge requests as focused as possible. Let us know if you have questions by emailing wordpress@umark.wisc.edu.