University Identity

Download the Cal Poly Web Template Kit (v6.2.1)

The Cal Poly Template has been updated to version 6.2.1 to provide a responsive website layout that will adapt to any mobile device screen. The template incorporates now-standard HTML5 / CSS3 elements and a brand new mobile navigation menu to support a flexible mobile layout. Website upgrades from older templates have been considered throughout the development process, and the overall template structure remains similar to the previous release.

Responsive template screenshots

Template Features

New in this version!

  • Homepage rotator and video elements are now responsive.
  • Updated the Cal Poly logo. See University Marketing's Graphic Standards for information about the wordmark.
  • Added A-Z and utility navigation to the mobile menu.
  • Lots of small bug fixes! If you want to be an active contributor to the template source, please contact portalgroup@calpoly.edu.

Standard Features

  • Meets current W3C web validation standards for HTML5 and CSS3.
  • Includes media query breakpoints for small, medium, and large (desktop) device layouts.
  • Responsive mobile navigation replaces the main navigation when viewed on a small or medium-sized device.
  • Included sample content pages provide examples of the layout possibilities and a "home page" layout to meet the unique needs of various campus web sites, while still clearly representing Cal Poly.
  • CSS stylesheets and JavaScript are centrally hosted for efficient loading and a consistent Cal Poly look and feel.
  • Meets campus standards for minimum identity and communications elements.
  • Incorporates usability and accessibility best practices for Cal Poly logo linking to the Cal Poly home page, the search box formatting, the home page rotator, the mega-menu and many other features.
  • Includes numerous layout possibilities and a "home page" layout to meet the unique needs of various campus web sites, yet still clearly represent Cal Poly.

Information is Available ITS and Public Affairs ask that websites using the new Cal Poly template to not modify the original artwork or coding of the template system. In order to retain the accessibility of these templates, the structure (HTML), layout, and original design (artwork and CSS) must not be modified. In addition, Web sites that use a modified template structure cannot be upgraded to newer versions of the template and therefore will not be supported by Information Technology Services.


Package Contents


  • Sample Content Pages
    • sample-articlelists.html
    • sample-atoz.html
    • sample-content_and_styles.html
    • sample-forms.html
    • sample-homepage.html
    • sample-span_wide.html
    • sample-tables.html
  • Templates folder
    • home.dwt
    • master.dwt
    • span_normal.dwt
  • Library folder
    • breadcrumb.lbi - easier breadcrumb creation
    • deptinfo.lbi - department info
    • deptname.lbi - department name
    • footer.lbi - footer
    • main-nav.lbi - main menu
    • main-nav-meganav.lbi - expanded main menu
    • mobile-search.lbi - mobile search bar
    • right-nav.lbi - right nav menu
    • rotator.lbi - rotator
    • search.lbi - search
    • top-nav-accessibility.lbi - top nav accesibility links
    • top-nav-audience.lbi - top nav audience links
    • top-nav-AZ.lbi - top nav A-Z links
    • top-nav-quicklinks.lbi - top nav quick links
    • widgets.lbi - widgets
  • CSS folder
    • screen.css - Custom Web stylesheet
    • print.css - Custom print style sheet
  • images folder - use this to store your department's images and graphics

Cal Poly Template Download

Version 6.2.1 (see change status below if you're updating from a previous version)

  1. Download the ZIP archive file to your desktop.
  2. Locate the file on your desktop and double-click on the file.
  3. If a new File Explorer window opens...
    1. then simply drag the file named cp_template_standard_v6.2.1 into your web folder. Then close the new File Explorer window.
  4. If a File extract window pops up...
    1. Choose Action > Extract...
    2. In "Extract to:" type a period "." (This will extract the package to your current folder. If you want to extract to a specific folder on your computer, then browse to that folder to extract the package. )
    3. Click Extract. The site will extract with a folder named cp_template_standard_v6.2.1 which contains the template files
    4. Drag the extracted folder to your Web folder.
  5. Use Dreamweaver "Manage Sites" to configure your Web site by pointing to the cp_template_standard_v6.2.1 folder.
  6. Use the template instructions to help you get started creating your Web site and to put accessible content into your pages.

Section 508 Compliance and Web Accessibility Best Practices

The Cal Poly Web Template v5.1 framework and sample content has been reviewed for Web Accessibility best practices as described in the Web accessibility Compliance Process Guide. The template passes both the automated checks and the manual checks, meeting both Section 508 and best practices for Web site accessibility. Note: The responsive v6.1 template is a derivative of v5.1.

Though the template and its sample content meets current Web accessibility standards, the content that you place into the template must also be made to comply with Section 508 standards and Web accessibility best practices; and your content must also comply with standards for HTML5 and CSS3. The template instructions will assist you with producing accessible content.


Release Notes

Note about updates and version changes

Using our three digit versioning system, you can determine if the template you've used can be upgraded with more current CSS.

This is how to interpret a version number, such as 6.1.0:

  • First digit - indicates a major change in the template architecture or design. This will typically stay pretty constant for the foreseeable future.
  • Second digit - indicates HTML code additions or fixes that affect layout or function. The fundamental code architecture of the template has not been changed.
  • Third digit - primarily used to indicate a change to the CSS or Javascript such as style additions or fixes. May also include minor HTML code changes that don't affect layout or function.

More recent versions of the CSS can be used with template implementations which have the same second digit. For example, the CSS from the 6.1.1 template can be used with the 6.1.0 version. And likewise, the CSS from a 6.0.3 template can be used with the 6.0.1 template. However, you cannot use the CSS from the 6.1.1 template with earlier versions of the template HTML, such as 6.0.1.

In general and with limited exceptions, you can not interchange template components with different first digits. For example, components from the 6.x.x version cannot be used with components from the 3.x template.

Determine Your Template Version

You can determine your template HTML version by looking for the version number in the comments at the top of the code of any web page in your site. Load a page and view the code (in Firefox: View > Page Source. In IE: View > Source). Look for the version number in the comments.

Version 6.2.1 originally posted 04/27/16

  • Homepage rotator and video elements are now responsive.
  • Updated the Cal Poly logo. See University Marketing's Graphic Standards for information about the wordmark.
  • Added A-Z and utility navigation to the mobile menu.
  • Lots of small bug fixes! If you want to be an active contributor to the template source, please contact portalgroup@calpoly.edu.

Version 6.1.0 originally posted 04/24/15

  • Meets current W3C web validation standards for HTML5 and CSS3.
  • Includes media query breakpoints for small, medium, and large (desktop) device layouts.
  • Responsive mobile navigation replaces the main navigation when viewed on a small or medium-sized device.

Version 6.0.0 (beta) released to a best test group 01/23/15

 

Version 5.1.0 originally posted 10/xx/12

Code changes to the MegaNav, and additional changes to the css. Important!: In order to make sure your MegaNav works properly, make sure you have the newest version of the css along with this version of the template.

  • New clear class added below each row block in the meganav to optimize spacing
  • Span tags added inside h3 headings within MegaNav to allow spacing
  • CSS added to allow h3 headings to be linked in MegaNav (Best coding practice is to include the <a> tag within the <span> tag that is within the h3)
  • Headers in the MegaNav now all properly align, and can now take up two lines
  • Fixed close menu button in the meganav to position properly
  • Removed .alignRight and .smallText css
  • Fixed No Style tables (.table_noStyle) to display header row properly
  • Fixed issue with A-Z and Quicklinks which caused menus to close prematurely
  • Added Google+ icon for use in the footer

If you're upgrading to this from version 5.0.0. please contact the ITS Service Desk for assistance 805-756-7000.

Version 5.0.1 originally posted 06/19/12

New Cal Poly template look and feel. If you're upgrading to this version from version 3.4.x, please contact the ITS Service Desk for assistance 805-756-7000.

Version 5.0.0 (beta) released to a beta test group 05/09/12

 

Version 3.4.7 originally posted 12/8/10 (reposted 09/26/11)

On 09/26/2011, the new Cal Poly logo graphic replaced the old logo. The HTML and CSS have not been changed.

  • Added .iconLinks class for a icon-enhanced navigation option (see right side of Cal Poly homepage for example)
  • Fixed department links ul list in footer to use unicode for bullet and space
  • Fixed margin for columns-based ul and ol
  • On sample pages, added examples of iconLinks class uses and removed uneeded spaces in code that caused columns to run off the page when viewed in Dreamweaver CS5
  • Changed width on tables .directories class to better accomodate for Dreamweaver CS5 display bug
  • Added .emphRed class for bolded red text and added .emphBlue class for bolded blue text