Convert from the Old Templates

Converting from the old UNC templates to the new UNC templates is easy, however, it does require a little bit of code. These instructions are for Web authors who have the ability to convert their own sites from existing UNC templates.

Make a Backup

Make a backup of your current site.

CSS Changes

Open up the main template; it is located in the "Templates" folder and in most cases is called "template.dwt" or "master.dwt".

In Dreamweaver, click on the [Code] button.

Around 13, you should see the following lines of code:

<style type="text/css">
     @import url("http://www.unco.edu/assets/css/uncheader750-2009.css");
     @import url("../css/structure.css");
     @import url("../css/colors.css");
</style>
<style type="text/css" media="print">
     @import url("../css/printer.css");
</style>

Replace that code with this:

<style type="text/css">
     @import url("http://www.unco.edu/assets/css/templates/master.asp?c=blue");
</style>

Change the CSS URL above to match the CSS URL on the "Choose a Template Page"

Update the UNC Header

In your master template, the old UNC header code should be around line 24.

<div id="UNCheader">
<ul id="accessibility" class="nopda">
<li id="skipnavigation"><a href="#topnav" accesskey="n" title="Skip to navigation"> </a></li>
<li><a href="#content" accesskey="c" title="Skip to Content"> </a></li>
<li><a href="http://www.unco.edu/accessibility.html" accesskey="0" title="Accessibility Statement"> </a></li>
</ul>
<ul id="logo">
<li><a href="http://www.unco.edu"><span>Go to the University of Northern Colorado's Home Page</span></a></li>
</ul>
<ul id="linkrow">
<li id="azindex"><a href="http://www.unco.edu/mainindex.asp"><span>A to Z Index</span></a></li>
<li id="findpeople"><a href="http://www.unco.edu/people.asp"><span>Find People</span></a></li>
<li id="directory"><a href="http://www.unco.edu/officelookup.asp"><span>Office Directory</span></a></li>
<li id="departments"><a href="http://www.unco.edu/academic.asp"> <span>Departments</span></a></li>
<li id="calendar"><a href="http://www.unco.edu/calendar/calendar.asp"> <span>Calendar</span></a></li>
<li id="unchome"><a href="http://www.unco.edu/"><span>University of Northern Colorado Home</span></a></li>
<li id="contact"><a href="http://www.unco.edu/contact.shtml"><span>Contact Us</span></a></li>
<li id="applynow"><a href="http://www.unco.edu/decide.shtml"><span>Apply Now</span></a></li>
</ul>
<form action="http://search.unco.edu/search" method="get">
<input name="q" id="searchbox" size="20"/>
<input type="submit" value=" " id="searchbutton"/>
</form>
</div>

Replace that code with this:

<div id="uncwrapper">
<div id="UNCheader">
<ul id="accessibility" class="nopda">
<li id="skipnavigation"><a href="#topnav" accesskey="n" title="Skip to navigation"> </a></li>
<li><a href="#content" accesskey="c" title="Skip to Content"> </a></li>
<li><a href="http://www.unco.edu/accessibility.html" accesskey="0" title="Accessibility Statement"> </a></li>
</ul>
<ul>
<li class="unchome"><a href="http://www.unco.edu" title="University of Northern Colorado Home Page"> </a></li>
<li class="betl"><a href="http://www.unco.edu/life" title="Bringing Education to Life"> </a></li>
<li class="az"><a href="http://www.unco.edu/mainindex.asp" title="A to Z Index"> </a></li>
<li class="findpeople"><a href="http://www.unco.edu/people.asp" title="Find People"> </a></li>
<li class="officedirectory"><a href="http://www.unco.edu/officelookup.asp" title="Office Directory"> </a></li>
<li class="departments"><a href="http://www.unco.edu/academic.asp" title="Departments"> </a></li>
<li class="calendar"><a href="http://www.unco.edu/calendar/calendar.asp" title="Calendar"> </a></li>
<li class="contact"><a href="http://www.unco.edu/contact.shtml" title="Contact"> </a></li>
<li class="visit"><a href="http://www.unco.edu/visit" title="Visit"> </a></li>
<li class="apply"><a href="http://www.unco.edu/decide.shtml" title="Apply"> </a></li>
</ul>
<form action="http://search.unco.edu/search" method="get">
<input name="q" id="searchbox" size="20"/>
<input type="submit" value=" " id="searchbutton" title="Search"/>
</form>
</div>
</div>

Add #bigpage DIV

Right below the UNC header code, you should see a definition for #page:

<div id="page">
Add a DIV with the ID of "bigpage" above it:
<div id="bigpage">
<div id="page">

Scroll down in the code until you see the footer, this could be around line 118:

<!-- TemplateEndEditable --> </div>
</div>
</div>
<div id="footer">
...

Add a closing DIV tag (to close #bigpage) in between the closing page DIV and the Footer DIV. There will be a total of four </div> tags:

<!-- TemplateEndEditable --> </div>
</div>
</div>
</div>
<div id="footer">
...

Add the Right Column (optional)

If you intend to use the right column, find the end of the Content DIV:

<!-- TemplateEndEditable --> </div>

Add a new DIV with the ID of "rightcol" and an editable region called "rightcol":

<!-- TemplateEndEditable --> </div>
<div id="rightcol">
<!-- TemplateBeginEditable name="rightcol" -->
 
<!-- TemplateEndEditable -->
</div>

Add Google Analytics Code

If your site does not have the Google Analytics Code on it, or if you would like to update your Google Analytics Code, add the following code right before the ending head tag </head>:

<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-7780580-7']);
  _gaq.push(['_setDomainName', '.unco.edu']);
  _gaq.push(['_trackPageview']);
  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>

Save the template and update the files attached to the template.

The template has been installed. One thing you might notice is that your home page image width looks small. You can fix this by navigating to our image gallery and choosing a header image.

Publish Your Site

Publish your site. If you have any questions, please contact Web Communications.