Contents
“How Did They Do That?” Under the Hood with Illinois Themed Websites
Melissa Waller, College of Agricultural, Consumer and Environmental Sciences
Dena Strong, Web Hosting, Technology Services
Bryan Jonker, IT Partners, College of Education
Robert Slater, Web Hosting, Technology Services
WordPress
Cafe Menu
Did you know Bevier Cafe’s menu runs on the WordPress version of the Illinois Theme on publish.illinois.edu (PIE)?
Latest Post Block
- Use posts and categories
- Use featured image for post or category to display images
- Select specific categories and information you want to display
- Directory example using posts – hfaging.ahs.illinois.edu/directory (hosted on PIE)
Content Views Plugin & Shortcode
- Use posts or pages and categories
- Select specific categories and information you want to display
- Plugin documentation –publish.illinois.edu/plugindemo/2020/07/07/content-views-plugin/
- *If you are going to change any colors/settings, run an accessibility checker for contrast and font sizes.
NOTE: Anyone in need of a free meal or want to donate to a worthy cause – Learn more about Everybody Eats at Bevier Cafe.
Template Sites
Currently, in development on Publish.illinois.edu, you will be able to install your own copy of these with one click on Publish when they are fully released as the “A la Mode” plugin (coming soon!) In the meantime, you can read the template pages for a description of where and how the various pages’ features were set up and configured.
- publish.illinois.edu/template-site: A sample site with self-documenting starter pages for a personal profile site or a research-based site
- publish.illinois.edu/template-conference: A sample site with self-documenting starter pages for a conference or event, including archiving capability if the conference happens more than once
Drupal
Use parts and pieces of the toolkit
- Drupal uses the Header, Footer, Accordion, and Hero shared components.
- Drupal uses Big Buttons which are similar to the Clickable Cards, but built natively in Drupal and may be replaced by the shared component someday. Uses the same look and feel, but not actual code.
- View Big Buttons on Drupal (Drupal code), WordPress (toolkit code added into WordPress CMS), and Sitefinity (toolkit code added into SiteFinity CMS) versions. All are slightly different but still reference the same visual look, behavior, and accessibility requirements.
- The Icon Row paragraph type uses the font included with the shared components to display icons.
Drupal’s documentation examples – drupal.webtheme.illinois.edu/paragraphs

Sitefinity
Multiple CMSs can use the toolkit!
See internal.education.illinois.edu/widget-examples to see how we have integrated the toolbox with Sitefinity.


HTML
Did you know that the College of Education’s Study Abroad browser uses the Illinois Theme to present data pulled from GitHub?
Taking a raw set of HTML files and using the toolkit.
For example, Education’s Study Abroad website (at studyabroad.education.illinois.edu) uses an older version of the header and footer.
View the back-end of this at the Github repository at github.com/itpartnersillinois/studyabroad.
How can you help?
Give us your feedback! What do you need for functionality in the WordPress or Drupal themes? Do you need the components to include something different? We need to know.
Contact
The WIGG Team on Microsoft Teams is where you can ask questions and get help.
Join the Web Implementation Guidelines Group (WIGG) on Teams or learn more about WIGG.
Links to Know
- builder.toolkit.illinois.edu: Provide your text and images, select your options, and get Illinois Theme component code that you can use in your own site.
- help.toolkit.illinois.edu: Illinois Theme component documentation
- publish.illinois.edu/plugindemo: A site that demonstrates each of the WordPress plugins available on publish.illinois.edu