CCS Web Templates

Starting a new project?

CCS Web Solutions has developed a new, AODA compliant Drupal template based on Bootstrap. For new Drupal 7 projects, we recommend using the latest template. The template described below is still available, but we don't recommend using it for new projects.


CCS Web Templates

In a joint project with the Library, CCS Web Solutions has provided new accessible and responsive web templates that can be used by the University of Guelph web development community.

  1. A new Drupal 7 Theme
  2. A static HTML5 template generated from the Drupal 7 theme. 

See the new template without content.

Note: Communication and Public Affairs at the University of Guelph also provides web templates that can be used.

Benefits of the New Templates:

The templates are both accessible to WCAG 2.0 Level AA conformance. Disclaimer: Please note that both templates have been tested for conformance as is, and if modified and/or content added, will need to be retested by the user to ensure conformance, i.e. conformance of these templates does not mean conformance on the website they are used to develop.

The templates are both responsive.  What does responsive mean?  Responsive means that they will provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from mobile phones to desktop computer monitors).

Some other highlights of the new theme include:

  • optional 'mega-menu'
  • optional slide-show banner
  • optional styled 'regions' that can enhance the look of your website.
  • ability to easily adapt to changes to overall University of Guelph navigation and search, with new placement of site menu
  • Follows University of Guelph branding, but can be re-coloured with permission from Communications and Public Affairs (www.uoguelph.ca/cpa)..
  • Follows University of Guelph Web Design guidelines as outlined by Communications and Public Affairs, http://www.uoguelph.ca/web/styleguide.

Drupal 7 Theme

Where to get it?

Source code for the responsive theme can be found in the CCS Web Solutions public source code repository.

To get a copy of the code using SVN, run the following command:

svn checkout https://svn.ccs.uoguelph.ca/svn/svn-public/platform/branches/7.x-7.x/sites/all/themes/custom/cornerstone/

Dependencies

Mega Menu

  • Menu Block
  • jQuery Update

The mega menu requires version 1.7+ of the jQuery library. Configure at admin/config/development/jquery_update.

The mega-menu is automatically populated from the menu that is configured to be Drupal's "Source for the Main links" (configured via admin/structure/menu/settings).

Optional Dependencies

Featured Content

  • U of G Feature - If desired, can be used to feature content in the carousel
  • U of G Slideshow - If desired, can be used to feature content in the carousel

To feature content:

  1. Navigate to Structure / Content Types / Article / Manage Display / Slide & ensure the Image field is shown.
  2. Move the "Feature Slideshow" block to "Featured" region.
  3. When creating a piece of content to be featured, be sure to upload an image and mark the content featured using the tab near the publishing options at the bottom of the screen.

Search

  • U of G Global Search - If desired, provides the UofG global search box via a block called "Global search form". For best results, display this block in the "Search" region.

HTML5 Static Template

A static template generated from the Drupal 7 template is also available for general use.

For best results, please point a Subversion client at the following URL:

https://svn.ccs.uoguelph.ca/svn/svn-public/project/websolutions/branches/7.x-8.x/themes/cornerstone/static/

CCS will continue to re-generate the code needed here from the Drupal 7 version of the theme at any time.  However this means the following:

  • The markup contains Drupal related information that is required
  • The file and folder structure is not perfect.  For ease of use, a static theme might deliver 4 files in a single directory (e.g. index.html, subpage.html, styles.css, scripts.js). however at this time this release of the static theme delivers several extra required files and folders.
  • The static theme supports SSI as-is, but it is not already broken down into template files.