Custom Style: Tagline
The wrapper system allows the web developer to include customized stylistic preferences on all pages of a unit or on individual pages of a unit.
The Tagline image is a presentational preference of the wrapper system. By default, an image containing the UNCG Tagline, "Inspire.Change." is placed in the background of the block containing the University Logo: uncgLogo. The CSS to do this so is located in the UNCG GLOBAL stylistic Preference files:
#uncgLogo {
margin:0;
background:#ffffff url("http://www.uncg.edu/global_uncg/images/inspire_change.gif") no-repeat 100%;
height:55px;
width:100%;
padding:0;
border-bottom-width:1px solid;
border-right:solid #fff 1px;
}
http://www.uncg.edu/global_uncg/style/uncg-screen.css
To override (or cascade over) this preference, a unit may create a CSS command dictating its own preference:
#uncgLogo {
background:#ffffff url("PATH TO YOUR IMAGE") no-repeat 100%;
}
unit-screen.css
Place the file in your unit's inc_unit/style/ directory.
Be sure to modify your unit's HTML header file to incorporate the stylesheet:
<!-- UNIT STYLESHEETS -->
<link rel="stylesheet" type="text/css" media="screen" href="PATH TO UNIT SCREEN STYLESHEET" />
<link rel="stylesheet" type="text/css" media="print" href="PATH TO UNIT PRINT STYLESHEET" />
unit_header.html
Learn more about Implementing Custom Unit HTML Head
Learn more about Implementing Custom Page HTML Head
Case Scenario
The Office for Left-handed Students
Having decided to not utilize the default values for the Tagline, and properly understanding the Web3 Unit Requirement's restrictions, the Office for Left-hand Students creates a custom Tagline across their unit:
#uncgLogo {
background:#ffffff url("/olh/images/students.gif") no-repeat 100%;
}
/olh/inc_unit/style/olh-screen.css
And Implements a reference to their unit stylesheet in Unit's HTML Head:
<meta name="author" content="Lew Leftward, OLH, UNCG" />
<link rel="shortcut icon" href="http://www.uncg.edu/favicon.ico" />
<!-- UNIT STYLESHEETS -->
<link rel="stylesheet" type="text/css" media="screen"
href="http://www.uncg.edu/olh/inc_unit/style/olh-screen.css" />
<link rel="stylesheet" type="text/css" media="print"
href="http://www.uncg.edu/olh/inc_unit/style/olh-print.css" />
/olh/inc_unit/unit_header.html
The Office for Left-handed Students implements the UNIT_ADMIN variable in its unit_variables.html page and designates the file via it's path as the value of the variable.
<!--#set var="DEPT_NAME" value="Office for Left-Handed Students" -->
<!--#set var="DEPT_ADDRESS" value="EUC Suite 101" -->
<!--#set var="DEPT_PHONE" value="336.344.LEFT" -->
<!--#set var="DEPT_FAX" value="336.344.1111" -->
<!--#set var="DEPT_EMAIL" value="lefty@uncg.edu" -->
<!--#set var="UNIT_NAME" value="Left-Handed Students" -->
<!--#set var="UNIT_URL" value="htp://www.uncg.edu/olh/" -->
<!--#set var="UNIT_HEADER" value="/olh/inc_unit/unit_header.html" -->
/olh/inc_unit/unit_variables.html