ASU Web Community

ASU Drupal Theme

ASU Zen theme screenshot ASU Web developers are encouraged to use the new, official University template for all Web sites that do not require more specific branding, such as those that fall under a set of College-related guidelines (e.g., CLAS). The official ASU Drupal theme—ASUZen v. 5.x-2.0—was released on December 12, 2007. (A static HTML version of the official ASU theme is also available.)

The ASU Zen theme is based off of the Zen theme by Lullabot's Jeff Robbins. The ASU-specific modifications were made by Jeff Beeman and Kathy Marks using the standardized ASU look and feel provided on template.asu.edu and in the ASU themes directory.

The ASU Zen theme was designed to be as generic as possible in order to provide optimal flexibility for site maintainers, while also pulling from a core set of template files. The theme uses core template files provided in the ASU themes directory for the ASU header, footer and various related images and CSS. This means easier site maintenance for site administrators, as changes to the core header and footer files immediately propogate out to any sites using the theme. Pretty slick, huh?

The ASU Zen theme is a fluid-width, two- or three-column layout and is optimized for 1024px resolution. The theme is XHTML 1.0 Transitional / CSS 2 compliant and cross-browser compatible with Firefox 2.0 (Mac and Win), IE 6, IE 7, Opera 9 and Safari 3.

Download

You can download the latest release version of the ASU Drupal theme, as well as other ASU templates, at http://template.asu.edu. You can also check out the release version in the Subversion Code Repository or, if you're feeling adventurous, you can checkout the development version and follow along with our changes.

2.0 Release Subversion URL:

https://svn.asu.edu/svn/drupal/themes/asuzen/tags/5.x-2.0

Development Subversion URL:

https://svn.asu.edu/svn/drupal/themes/asuzen/branches/5.x-dev

Installation

Please see the included README.txt file for full notes and brief installation instructions.

If your site is hosted on the ASU Webhosting service, you can refer to the Handbook pages on Installing a Theme Using DirectAdmin. ASU Web Hosting customers also can contact ASU Web Consulting for assistance in deploying the University template using the virtual include system.

Rhino ASU Theme

The Rhino-created theme has been replaced by ASUZen 5.x-2.0.

NOTE: The ASU Web Community site is currently NOT using the University template. We are in the process of converting it, so stay tuned.

Wednesday, March 12th, 2008 - 2:36 pm
  • mrye1

I only have a few comments to make on this theme.

  1. When viewing a site that is using https, IE will bug the user with continuous questions on whether to allow secure and non-secure content to be displayed. The non-secure content comes from the files required by the asu_head_tags.inc.php and asu_header_login.inc.php that are being included in the page.tpl.php template file.
  2. Out of the box, printing does not look pretty at all on any browser. I had to take out the left and right columns and fix the printing by adding
    <style type="text/css" media="print"> @import "<?php print base_path() . path_to_theme(); ?>/css/print.css"; </style>
    in the page.tpl.php file as well as make a new stylesheet called print.css and place that in the css/ directory. The styles set for #squeeze seem to mess up printing by making the content print on one half of the page. I still have not been able to get long tables to print correctly in Firefox, they seem to get cut off at the end of the page but the headers will still print on the next; IE7 will print them correctly
  3. Replace the following lines in page.tpl.php
    <link rel="stylesheet" type="text/css" href="/themes/asuzen/css/ie6.css" />
    <link rel="stylesheet" type="text/css" href="/themes/asuzen/css/ie7.css" />
    to
    <link rel="stylesheet" type="text/css" href="<?php print base_path() . path_to_theme(); ?>/css/ie6.css" />
    <link rel="stylesheet" type="text/css" href="<?php print base_path() . path_to_theme(); ?>/css/ie7.css" />
    because not everyone will put this theme directly in the /themes directory, some like to put it in /sites/all/themes or /sites/all/default
  4. For the same reason in #3, all the images that are being used in the stylesheets need to have relative urls rather than static so in the css/icons.css file
    list-style-image: url(/themes/asuzen/images/blue_bullet.gif);
    should be
    list-style-image: url(../images/blue_bullet.gif);

These are just some things that I found to be wrong. I use my drupal site for our office intranet and so I will be working on this theme for a while before I start using it. It is, though, very pretty; thank you Jeff for your hard work on it.

Marcus Anthony

Student Financial Assistance