Beruflich Dokumente
Kultur Dokumente
Table of Contents
7 Introduction
9
9 9 10 11 12 12 12 12
13
13 14 15 15 16 17 18
Overview to Styling
In This Chapter Before You Begin High-Level Procedures Steps for Styling the Datatel Portal SharePoint 2010 Custom Styling Components Styling Components Timing Your Styling Customizations
19
21
21 22 22 22 23 24 26 26 30 31 33
Styling Procedures
Creating Custom Themes
In This Chapter Understanding Themes Applying a Theme Modifying Color Swatches Modifying Text and Background Colors Modifying Datatel Theme Colors Procedures for Customizing Themes Identifying Colors for a Custom Theme Creating Custom Themes Deploying a Custom Theme as a Feature Applying Your Custom Theme
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Table of Contents
35
35 36 38 38 41 41 42 43 44 45
47
47 48 48 49 51 54 54 56
57
57 58 58 59 59 60 60 61 61 61 62 64 64 65 66 67
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Table of Contents
69
69 70 71 72 73 74 75 78
Styling My Sites
In This Chapter Understanding My Sites Disabling the Datatel Theme on My Sites Creating My Sites with a Custom Theme Determining the My Sites Host URL Applying a Custom Theme to the My Sites Host Specifying a Custom Theme for New My Sites Applying a Theme to Existing My Sites
81
83
83 84
Appendices
Custom Color Planning Worksheet
In This Appendix Planning Worksheet
85
85 86 88 88 89 90 91
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Table of Contents
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Introduction
Introduction
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
10
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Typographical Conventions
Typographical Conventions
The following presentation conventions are used in this book to help you identify important information quickly and easily. Table 1 illustrates the typographical styles used in this book, and explains their significance.
Table 1: Typographical Conventions Used in This Manual Style
bold
Type of Information
Items that you can select, such as menu items, buttons, or other options that appear on the screen.
Examples
On the File menu, point to New, and then click Folder. Select 100% from the drop-down list box for the Zoom field. Click Cancel to return to the previous form.
bold Courier
Specific entries that you make in a field, typically by typing one or more of the letters in the entry. italic Text that can vary, depending on the specific item or record involved. Note that the text might also be italic courier if it is part of a message displayed on your screen, or italic bold courier if it is something that you must type, substituting your own value for the italicized word or words.
In the Update Mode field, enter Yes. (Note that to enter Yes in a field, you normally need to type just the letter Y.) Type dictname_SQL, where dictname is the name of the dictionary. If the system displays the message PersonID Not Found, proceed to Step 4 to create a new Person record.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
11
Important Notices
Particularly important information is emphasized in the following types of notices.
Alerts
Alerts call attention to critical information for users. For example, Alerts are used to warn you of situations where data loss or corruption could occur if certain actions are performed incorrectly. An example is shown below.
ALERT! Be extremely cautious not to delete the VOC; this will cause serious damage to your data.
Notes
Notes provide special additional information that you might want to know, or that might help you perform a task. An example is shown below.
Note: Colleague uses the Account Type information to determine the default path prompts.
Technical Tips
Technical tips provide details that might help system administrators or power users. Examples include explanations of behind-the-scenes processing, lists of file names, and names of validation code tables. An example is shown below.
Technical Tip: The stylesheet print server will create a temporary file in the printdata directory (within the stylesheet print server directory) to hold a print job. This file will then be parsed into 2MB files in order to be sent to the printer. Be aware that the initial file may become very large, depending on the size of the print job. Make sure you have ample available drive space when using stylesheet printing.
12
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Introduction
Overview to Styling
In This Chapter
The Datatel Portal 3.0 delivery includes a user interface (UI) that utilizes select Microsoft SharePoint 2010 user interface features. This document assists you as you apply your own institutions branding to the Datateldelivered look and feel of the Datatel Portal. It includes best practices and tips to assure that your custom branding components will interact well with both Datatel and Microsoft branding. Table 2 lists the topics covered in this chapter.
Table 2: Topics in This Chapter Topic
Before You Begin High-Level Procedures Styling Components Timing Your Styling Customizations 14 15 17 18
Page
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
13
Reference
14
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
High-Level Procedures
High-Level Procedures
This section contains a high level outline of the steps you can take to style your installation of the Datatel Portal.
Procedure
page 13 page 21 page 35 page 47 page 69 page 57
Results
Ready to continue styling the Datatel Portal. You have created custom theme files for branding. You have created custom stylesheet files for branding. You have created custom master page and page layout files for branding. You have a custom theme you want to apply to My Sites. You have created custom site templates in SharePoint 2010.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
15
Description
Datatel theme file.
Custom Equivalent
FEATURES\D01 Themes\D01Theme D01Custom.thmx
Stylesheet
Master page
SharePoint master page file used for migrated or new sites. SharePoint layout page file
Layout pages
Templates
16
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Styling Components
Styling Components
The following are summaries of each of the styling components that you can use to customize your SharePoint 2010 portal. Theme. You can use a theme to customize the visual appearance of SharePoint. When a theme is applied, SharePoint auto-generates the stylesheet (CSS) file and images for the theme on-the-fly, and stores them in the _themes folder of the site where the theme is applied. For more information, see Understanding Themes on page 22. Stylesheet. A custom stylesheet (CSS) file allows your institution to change colors and fonts, backgrounds, images, and layout properties such as margins and borders. For more information, see Creating a Custom Stylesheet on page 38. Master page. A master page defines the elements that are common to all pages in a SharePoint top-level site and its subsites. This includes items such as the top banner, tool bars, navigation bars, a school logo, the footer, and a search box. When you define all of these elements in one master page file, they can be referenced by all of the other pages in the portal. This makes it easier to change the general look and feel of a site. When you change one file, then all of the pages and sites using the master page are automatically updated. See Creating Master Pages and Page Layouts on page 47. Layout page. In combination with master pages, a layout page defines the layout of elements on a page (except for anything that is defined directly in the master page). This includes web part zones and their locations, and code or elements that belong in pages using a specific layout only. For example, a tool bar that is not part of the main master page might be needed for other pages in the portal. A layout page does not include specific web parts. Those are defined in the template files. See Creating Master Pages and Page Layouts on page 47. Site template. A custom site template allows you to define the properties of new sites created using the template. You can create custom site templates to define web parts or other components for all newly created sites. For example, you might decide that all constituency templates should contain the Contacts web part. My Site. This is a personal space where users can save documents and share work with others. A Datatel-delivered theme is enabled and applied to all My Sites that you create after installing the Datatel Portal software. See Disabling the Datatel Theme on My Sites on page 71 if you want to disable the Datatel My Site theme styling.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
17
Otherwise, you can provide users with a customized My Site theme page that uses colors from the main Client portal. See Creating My Sites with a Custom Theme on page 72 for more information.
CSS files. You can customize stylesheet (CSS) files anytime. When you apply your CSS modifications to a site, the changes take effect immediately. If a site already references a CSS file and you update the file, those changes take effect immediately. Custom master pages and page layouts. You can modify custom master pages and page layouts at any time; before you create a site or after it is live. You can apply a new master page to a site at any time and the new master page content will show up in existing sites immediately. If a site is using a master page and you update the code in the master page, then the changes will be seen immediately in a site using the master page.
18
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Styling Procedures
Styling Procedures
In This Chapter
This chapter contains a series of procedures that you will need to perform as you style and customize your Datatel Portal site. Table 6 lists the topics covered in this chapter.
Table 6: Topics in This Chapter Topic
Understanding Themes Procedures for Customizing Themes 22 26
Page
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
21
Understanding Themes
SharePoint 2010 gives you the ability to make styles into a theme.1 This means that you can replace Datatel-delivered stylesheet colors for fonts and solid backgrounds, and even recolor images with a tint.
Note: See Understanding Cascading Stylesheets on page 36 for an overview of Datatel-delivered stylesheets. You can use the steps in Creating a Custom Stylesheet on page 38 if you would rather just customize the stylesheets.
A specific Datatel theme is delivered as a feature of the Datatel Portal. This theme is provided to give you a head start in creating your own custom theme. For example, the colors included in the Datatel theme align with the colors contained in the Datatel-delivered stylesheets. You can map which colors apply to the interface and where.
Applying a Theme
You can modify SharePoint 2010 color swatches while creating a custom theme. You can also choose to modify the colors contained in the Datateldelivered theme.
1. The default SharePoint CSS files are tagged with comments that tell SharePoint to substitute colors and images with the values from the theme. If you switch themes, SharePoint generates a new set of CSS files and images with the result of this substitution.
22
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Understanding Themes
Note: Datatel recommends that you keep Dark 1 as black and Light 1 as white when creating a custom theme.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
23
RGB Values
R 255, G 255, B 255
Where Used
Body background Site Actions link text Welcome/login text color Web part backgrounds Web part titles Left panel background color Web part borders Background color for My Week and Picture of the week web parts Top navigation text color Web part Text color Bread crumb text color WebAdvisor border color My Week calendar text Web part Add New and Upload Links Row borders Selected navigation text and border My Week calendar header background text and borders WebAdvisor text Add new and Update link hover text Row titles Background behind Site Actions and Browse navigation Course catalog search results titles Header/Footer background color Portal Help icon My Week calendar day header background Course catalog tips box for Course and Sections Homepage Course Catalog Search page borders Course Catalog section info header Admin page menu bar background Not used by Datatel Web part title bars My Week calendar selected day, weekend day, and past or future month days background To-do list To-do info background color Course Catalog Add to preferred list button Course Catalog web part borders
Light 2
Dark 1
R 51, G 51, B 51
Dark 2
Accent 1
Accent 2 Accent 3
24
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Understanding Themes
RGB Values
R 220, G 220, B 220
Where Used
Constituency navigation link borders My Bookmark separators WebAdvisor line breaks Horizontal rule line below bread crumbs Course Catalog alternating row browse results Calendar day selection My Learning Provider Classes web part background My Notifications header background Side bar border color Add to list warning icon Add to list hover background Calendar today background color Sidebar background WebAdvisor menu background My Week calendar event day row background Web part row background color Picture Rotator title color Most hyperlinks throughout the site Course Catalog Enrolled button Add to preferred list background color
Accent 5
Accent 6
R 77, G 77, B 77 R 0, G 0, B 0
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
25
Page
Step 1. In a browser, access the top-level site of the main portal site collection as an administrator.
Step 2. At the left end of the SharePoint ribbon, click Site Actions and then Site Settings.
26
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Step 4. To apply a theme, select the Specify a theme to be used by this site and all sites that inherit from it option in the Inherit Theme section.
Step 5. Select the Datatel theme in the Select a Theme subsection as shown in Figure 3 on page 28.
Note: You might prefer to start from any of the Microsoft themes in the list.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
27
Step 6. To help you determine which colors to use for your own theme, Datatel recommends that you make changes to the color swatches provided in the interface and preview them until you are satisfied.
28
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Step 7. To make color changes, click the Select a color link next to the color swatches in the Customize Theme section (Figure 4). Then choose from the colors provided or type in your own colors.
Step 8. To view how colors will be applied, click on Preview in the Preview Theme section to view the newly themed site in a pop-up window.
Figure 4: Color Swatches
Step 9. When you are satisfied with your color choices, make a note of the colors (hexadecimal numbers) using the Custom Color Planning Worksheet on page 83 for the future creation of your own custom theme file.2
ALERT! Make sure you have recorded your changes. Any changes to the theme from this page are named as Custom by SharePoint and can be applied to the site. They will not be stored for later use and should not be considered permanent. Instead, you would need to create a custom theme file.
2. You can use a printed copy of the Custom Color Planning Worksheet for each custom theme that you create.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
29
Step 1. From your SharePoint server, access the top-level site of the portal site collection as an administrator.
Step 2. At the left end of the SharePoint ribbon, click Site Actions and then Site Settings.
Step 4. Click on the Datatel theme. This will download the Datatel.thmx file.
Step 5. Save it as a custom file (for example, D01Test.thmx or D01Custom.thmx) in a folder you create, such as a My Custom Themes folder on the SharePoint Server located under, for example: C:\Program Files\Common Files\
Step 6. Using a program such as Theme Builder, open a custom theme file. For example, D01Custom.thmx.
Note: Click on the color swatches and input your own choice of colors using the conversions from your chosen hexadecimal numbers to RGB values recorded in the Custom Color Planning Worksheet on page 83. Note: If you want to convert hexadecimal numbers to their RGB (Red, Green, Blue) equivalents, you may want to locate a converter program. For example, Firefox ColorZilla contains a color picker that allows you to choose exact colors from a website. It then provides the information as Hexadecimal numbers, HSV (Hue, Saturation, Value) and RGB.
Step 7. If you want to deploy the new theme as a feature, continue with the steps in Deploying a Custom Theme as a Feature.
30
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Step 1. Access the FEATURES folder on the SharePoint Server located under C:\Program Files\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\FEATURES
Step 2. Make a copy of the Datatel Themes folder including all files and subfolders.
Step 3. Rename the folder for your new custom theme. For example, D01CustomTheme
Step 5. Save your desired custom file (for example, D01Custom.thmx) in the D01CustomTheme\D01Theme subfolder that you created in Step 4.
Step 6. Edit the Feature.xml file in the D01CustomTheme folder. Replace the existing GUID with a newly generated one.
Note: You will need a unique ID (GUID) for your feature. You can use Visual Studio to generate a new GUID. Otherwise, you can Google GUID Generator for an online generator to use.
Enter a Title and Description for the feature that will be displayed to identify your custom feature. Enter your custom THMX file.
<Feature xmlns=http://schemas.microsoft.com/sharepoint/ Title=Custom Portal Theme Description=Portal theme with custom colors Id=Your unique guid here Scope=Site> <ElementManifests> <ElementManifest Location=D01Theme\Elements.xml /> <ElementFile Location=D01Theme\D01Custom.thmx /> </ElementManifests> </Feature>
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
31
Step 7. Edit the Elements.xml file in the D01Theme subfolder. Fill in the following information:
<?xml version=1.0 encoding=utf-8?> <Elements xmlns=http://schemas.microsoft.com/sharepoint/> <Module Name=DatatelTheme Url=_catalogs/theme RootWebOnly=TRUE > <File Type=GhostableInLibrary Path=D01Theme\D01Custom.thmx Url=D01Custom.thmx /> </Module> </Elements>
Step 8. Install the new feature by running the following stsadm command: C:\Program Files\Common Files\Microsoft Shared\web server extensions\14\BIN\stsadm.exe -o installfeature -filename Your custom theme folder here\feature.xml Replace Your custom theme folder here with the name of the folder that you created in Step 3 on page 31.
Step 9. In a browser, access the top-level site of the main portal site collection as an administrator.
Step 10. At the left end of the SharePoint ribbon, click Site Actions and then Site Settings.
Step 11. Go to Site Settings > Site Collection Administration > Site collection features to activate your new feature (Figure 5 on page 33).
32
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Step 12. Reset IIS by entering the iisreset command at the command line.
Step 1. In a browser, access the top-level site of the main portal site collection as an administrator.
Step 2. At the left end of the SharePoint ribbon, click Site Actions and then Site Settings.
Step 4. To apply a theme, select the Specify a theme to be used by this site and all sites that inherit from it option in the Inherit Theme section.
Step 5. Select your custom theme from the list, and select the Apply the selected theme to this site and reset all subsites to inherit this setting option and then click Apply.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
33
34
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Styling Procedures
In This Chapter
This chapter contains a series of procedures that you will need to perform as you style and customize your Datatel Portal site. Table 9 lists the topics covered in this chapter.
Table 9: Topics in This Chapter Topic
Understanding Cascading Stylesheets Creating a Custom Stylesheet Stylesheet Customization Examples 36 38 41
Page
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
35
36
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Note: The order of the files listed above is important for displaying the look and feel properly. In CSS, the last style overwrites all others before it (for example, styles in Datatel2010CourseCatalog.css take precedence over all other styles in the stylesheets above it).
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
37
Step 1. Open the Datatel2010Branding.css stylesheet. This stylesheet includes: References to images found in the Datatel-delivered stylesheets only. The styles contain comment tags to explain which images they reference. They are organized based on the stylesheet from which they come.
Note: After you' have created your theme and determined which images need to be replaced, you can use the Datatel2010Branding.css stylesheet to help you identify which images you want to replace. Then you can copy and paste only those styles to a new custom stylesheet.
Step 2. Create a blank custom stylesheet with a custom name such as D01Branding.css.
Step 3. Copy and paste image styles from the Datatel2010Branding.css file into your custom stylesheet (D01Branding.css).
38
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Copy only the image styles for which you intend to replace the image references in your custom stylesheet as shown in Figure 6.
Step 4. Make sure your new images contain custom names. Examples of two images you are likely to replace The header logo image .datatelv4 .site-image-title{ background-image:url(/_layouts/images/Datatel/ DatatelPortal-logo2.png); } The footer text image .datatelv4 .dt-footertext { background-image:url(/_layouts/images/datatel/ footertext.png); } Make sure to save your new images to the following location: C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\IMAGES\Datatel\
Note: If you choose not to use the same folder that Datatel has provided, then make sure the style path includes the new folder reference.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
39
Step 6. Add a reference at the bottom of the stylesheets listed for your custom branding stylesheet (@import D01Branding.css) as shown in Figure 7.
Note: Because of a SharePoint bug in rendering the order of the stylesheets, you might need to change the order of the stylesheet references from that shown in Figure 7. See AnswerNet page 8379 for instructions.
If you have applied site themes, your changes may not appear immediately because SharePoint caches themed stylesheet files. Go to Central Administration and select Manage web applications under the Application Management category. Select your web application in the list and click on Manage Features. For the Datatel Refresh Themes entry, click to Activate. If it is already activated, then click to Deactivate and then Activate.
40
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Changing the logo image in the top banner will require copying the existing style from the Datatel2010Branding.css file into your custom stylesheet, changing the image URL to reflect the new image and identifying the height and width of your new image.
Note: The Datatel placeholder logo is a transparent PNG file at 301 pixels wide and 81 pixels in height. Keeping the height of your new image to 100 pixels or less is recommended.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
41
Changing the decorative header background image in the top banner will require copying the existing style from the Datatel2010Branding.css file into your custom stylesheet, changing the image URL to reflect the new image and identifying the height and width of your new image.
Note: The Datatel design background is a transparent PNG file at 1006 pixels wide and 103 pixels in height. Keeping the height of your new image to 103 pixels or less is recommended.
42
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Changing the footer text image in the footer will require copying the existing style from the Datatel2010Branding.css file into your custom stylesheet, changing the image URL to reflect the new image and identifying the height and width of your new image.
Note: The Datatel placeholder footer text image is a PNG file at 332 pixels wide and 44 pixels in height. The footer text uses the same gradient as the footer background gradient image footerpixel.png. The footerpixel.png gradient image is 1 pixel wide and 44 pixels in height, and will be modified by any color theme changes you made. It is recommended that you create a new version of the footerpixel.png gradient image in addition to a new image for the footertext.png image using the same background gradient to keep things consistent.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
43
44
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
The top navigation links and drop-down menus in SharePoint 2010 have only been modified in theme color by Datatel. If the theme changes that you have made do not result in the desired effect, you can copy and paste the styles listed in Figure 16 on page 46 into your custom stylesheet and make changes as needed.
Note: The images used are in the Microsoft Images folder (and not the Datatel Images folder). These gradient images contain transparency, so it will be necessary to change the background color in the styles in addition to making changes to the background images in order to obtain the desired effect.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
45
46
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Styling Procedures
Page
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
47
Master Pages
A master page defines the elements that are common to all pages in a SharePoint top-level site and its subsites. This includes items such as the top banner, tool bars, navigation bars, a school logo, the footer, and a search box. When you define all of these elements in one master page file, they can be referenced by all of the other pages in the portal. This makes it easier to change the general look and feel of a site. When you change one file, all of the pages and sites using the master page are automatically updated. Master pages include content holders that act as placeholders (often empty, sometimes not) for specific elements on a page. These placeholders are filled in with specific elements from each layout page.
48
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Master Page
Content Page
Master Page
Layout Page
Layout Page
All sites in the Datatel Portal share a single Master Page. The Datatel constituency template has a default.aspx layout page that contains web part zones where you can add web parts.
Layout Pages
In combination with master pages, a layout page defines the layout of elements on a page (except for anything that is defined directly in the master page). This includes web part zones and their locations, and code or elements that belong in pages using a specific layout only. For example, a tool bar that is not part of the main master page might be needed for other pages in the portal. A layout page does not include specific web parts. Those are defined in the template files.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
49
Various portal pages can share the same layout while containing completely different content. For example, a layout page might define three columns with several web part zones in each column. Different templates might then identify completely different sets of web parts that go into each of these zones.
Note: Layout pages are not used by team sites. For team sites, the default.aspx page defined in the site template defines the layout of the page.
Master Page
50
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Step 1. Access the SharePoint Server and find the FEATURES folder typically located under: C:\Program Files\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\
Step 2. Create a new folder that will hold the new custom feature. For example, D01MasterAndLayouts
Step 3. In this same folder, locate the DatatelMasterAndLayouts subfolder. Copy the following files and folders from DatatelMasterAndLayouts to the new custom feature folder D01MasterAndLayouts: Feature.xml ProvisionedFiles.xml Layouts\MainConstituencyLayout.aspx MasterPages\datatelv4.master
Step 5. Edit the Feature.xml file in your new custom D01MasterAndLayouts folder and replace the old GUID with the newly generated one. For example:
<Feature Id={72FDF19D-73ED-47ec-B3C2-7BEE6CF60AAF}
Step 6. Access the MasterPages subfolder in your custom feature folder and rename the file datatelv4.master with your new master page name. For example, D01v4.master
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
51
Step 7. Access the Layouts folder and rename the file MainConstituencyLayout.aspx with your new page layout name. For example, D01ConstituencyLayout.aspx
Step 8. Edit and modify the ProvisionedFiles.xml file to define a module for each of your two files. Follow the samples included in the file for Datatel. At the end, this file should contain only two modules; one for each of your new custom files (D01v4.master and D01ConstituencyLayout.aspx). For example, the D01.master module would look like this:
<Module Name=CustomMaster Url=_catalogs/master page Path=MasterPages> <File Url=D01v4.master Type=GhostableInLibrary> <Property Name=ContentType Value=master page /> <Property Name=MasterPageDescription Value=Custom Master Pages for D01 /> </File> </Module>
Step 9. Edit the Feature.xml file and modify the ElementManifest element to include only ElementFile elements for your custom master pages and layout pages. For example, your new ElementManifest element might look like this:
<ElementManifests> <ElementManifest Location=ProvisionedFiles.xml/> <ElementFile Location=MasterPages\D01v4.master/> </ElementManifests>
Step 10. Run the stsadm installfeature to install the feature in the server and stsadm activatefeature to activate the feature in a site An example of running it to install the D01MasterAndLayouts feature would be: C:\Program Files\Common Files\Microsoft Shared\web server extensions\14\BIN\stsadm.exe -o installfeature -filename D01MasterAndLayouts\feature.xml
Step 11. Edit each of your two new files to make the desired changes using HTML and ASP.
52
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Step 12. Access the site and change the master page settings by going to Site Actions > Site Settings > Master page under the Look and Feel category to select the newly created master page.
Note: If this is a top level site (home page of a site collection), an option can be selected on this same page to Apply this master page to all subsites.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
53
54
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
After making updates, you will see the following code in the D01v4.master (Figure 19):
<SharePoint:DelegateControl ID="DelegateControl2" runat="server" ControlId="GlobalSiteLink0" /> <a href="#" tabindex="-1" style="display:none"></a><a href="#" tabindex="-1" style="display:none"></a> <div class="s4-trc-container-menu"> <wssuc:Welcome id="IdWelcome" runat="server" EnableViewState="false"> </wssuc:Welcome> <wssuc:MUISelector runat="server"/> </div> <div class="helpdesk"> <a target="_blank" href="http://helpdesk.myschool.com" accesskey="<%$Resources:wss,multipages_helplink_accesskey%>" id="A123" title="HelpDesk" runat="server"><img id="Img123" src="/ _LAYOUTS/DATATEL/images/help.png" alt="HelpDesk" border="0" runat="server" /></a> </div> <div class="s4-help"> <div class="s4-clust"><a href="javascript:TopHelpButtonClick('HelpHome')" accesskey="<%$Resources:wss,multipages_helplink_accesskey%>" id="A4" title="<%$Resources:wss,multipages_helplinkalt_text%>" runat="server"><img id="Img2" src="/_LAYOUTS/DATATEL/images/ help.png" alt="<%$Resources:wss,multipages_helplinkalt_text%>" border="0" runat="server" /></a></div> </div>
In the branding stylesheet, the CSS style helpdesk needs to be defined as shown in the following sample stylesheet (Figure 19):
/* HelpDesk button in header */ .datatelv4 .helpdesk{ top: 1px; position:relative; display: inline; border: 1px solid transparent; height:22px; width:22px; /* [RecolorImage(themeColor:"Accent1",method:"Tinting")] */ background-image:url("/_layouts/images/datatel/myschool/ helpcenter.png"); background-repeat:no-repeat; float:left; margin:4px 4px 3px 21px; }
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
55
56
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Styling Procedures
In This Chapter
This chapter provides procedures for creating custom templates to be used for Portal constituency and team sites. Table 11 lists the topics covered in this chapter.
Table 11: Topics in This Chapter Topic
Understanding Templates Procedure for Creating a Custom Template Template Customization Examples 58 62 64
Page
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
57
Understanding Templates
Table 12 lists the concepts covered in this section.
Table 12: Topics in This Section Topic
SharePoint Site Templates Datatel-Provided Templates Custom Templates Template Naming Conventions 58 59 59 60
Page
Included in the files that make up the template is the onet.xml file. This is the file that includes most of the specifications listed above, and it is this file that you will modify to create your custom template.
58
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Understanding Templates
Datatel-Provided Templates
Datatel provides the templates listed in Table 13. As noted in Table 13, constituency and team site templates are applied automatically when those sites are created from Colleague. For more information about constituency and team site templates, see Template Naming Conventions on page 60.
Table 13: Templates Provided by Datatel Template Type
Site collection Course catalog site collection Constituency site Class team site Social team site Department team site Publishing site
Comment
You select this template when you create the main portal site collection. You select this template when you create a course catalog site collection. Automatically applied when a constituency site is created from the Organization Constituencies (OCON) form in Colleague. Automatically applied when a class team site is created from a Colleague course section. Automatically applied when a social team site is created from a Colleague campus organization. Automatically applied when a department team site is created from a Colleague organization department. You can select this template if you want to create a SharePoint publishing site with the same look as the rest of the portal.
Datatel templates are installed in the following folder on the SharePoint server: C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\SiteTemplates. Each template is a folder under that location. For example, the Datatel site collection template is in the DATATEL_SITE_COLLECTION folder.
Custom Templates
You can create custom versions of the templates provided by Datatel. Because any change made to the template can also be made in the site after it is created, it makes sense to create a custom template only if you expect to create multiple sites of that type. For example, you might want to create a custom class site template if you plan to create class sites from all of your Colleague course sections. On the other hand, it would probably not make sense to create a custom site collection template unless you expected to repeatedly create new site collections, for example for training purposes.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
59
Template Name
DATATEL_CONST_STUDENT DATATEL_CONST_FACULTY DATATEL_CONST_ADMINISTRATION DATATEL_CONST_STAFF DATATEL_CONST_EXECUTIVE DATATEL_CONST
The process that creates a constituency site from Colleague looks for templates in the following order: Your custom template (if you choose to create one) for this constituency. This template must be named CUSTOM_CONST_constituencyID, where constituencyID is the Colleague constituency ID that you enter at the Constituency LookUp prompt when you access the Organization Constituencies (OCON) form. Example: CUSTOM_CONST_STUDENT A Datatel-provided template for this constituency, named DATATEL_CONST_constituencyID. Datatel provides the constituency site templates listed in Table 14. To use the Datatel template, the Colleague constituency ID that you enter when you create the constituency must match the value shown in Table 14. Your custom template (if you choose to create one) for all constituencies that dont have a specific template. This template must be named CUSTOM_CONST. The Datatel-provided generic template for all constituencies that dont have a specific template. This template is named DATATEL_CONST.
60
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Understanding Templates
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
61
Step 2. Perform the following steps to create a custom manifest file that references your custom templates: a. Locate the webtempdatatel.xml file, in the C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\1033\XML folder. b. Make a copy of the webtempdatatel.xml file and place the copy in the same folder. Suggested name for the new file: webtempcustom.xml. This is your custom manifest file. c. Open the custom manifest file in a text editor.
62
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
d. Remove the existing <Template Name> sections from the file, and insert a new <Template Name> section for each of your custom templates. Figure 22 shows an example of the <Template Name> section for a custom generic constituency template. For Template Name, enter the name of the template folder that you created in Step 1 on page 62. For ID, enter any number that is unique (not already used in one of the other webtemp files). This ID is not directly tied to the template code. A good best practice is to start IDs using numbers above 5000 so they dont conflict with Microsoft or Datatel templates. For Description, enter a free-form description that will identify your template when viewed in the template gallery. e. Save your changes to the custom manifest file.
Figure 22: Example <Template Name> Section in the Custom Manifest File
<Template Name="CUSTOM_CONST" ID="5001"> <Configuration ID="0" Title="Custom Constituency Template" Hidden="FALSE" Description="Custom template for constituency sites" DisplayCategory="Datatel" ImageUrl="/_layouts/1033/images/IPPT.gif"> </Configuration> </Template>
Step 3. Under the new template folder that you created in Step 1 on page 62, in the XML subfolder, open the onet.xml file in a text editor.
Step 4. Make the desired changes to the onet.xml file. See Template Customization Examples on page 64 for examples of template changes you can make by modifying the onet.xml file.
Step 6. Reset IIS by entering the iisreset command at the Windows command prompt.
Step 7. To test the new template, go to your portal site collection and use standard SharePoint methods to create a site, selecting your new custom template.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
63
Page
Note: Remember to do an iisreset after each change, and then create a new site to see the result of the change (existing sites will not reflect changes to the template).
64
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
In this case study, the properties emphasized in Figure 24 will be modified: The web part will be moved to a different zone on the page. The title of the web part will be changed from Unread Messages to Unread Mail. The web part will be provided with a border by changing the chrome type from None to Default. Figure 25 on page 66 shows that section of text after the changes.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
65
Figure 25: The Same Section After Changes to the Web Part Properties
<!-- Unread Messages --> <AllUsersWebPart WebPartZoneID="CenterLeftColumn" WebPartOrder="1"><![CDATA[ <webParts> <webPart xmlns="http://schemas.microsoft.com/WebPart/v3"> <metaData> <type name="Datatel.Portal.WebPart.UnreadMessages.UnreadMessages, Datatel.Portal.WebPart.UnreadMessages, Version=1.0.0.0, Culture=neutral, PublicKeyToken=55c547a3498c89fb" /> <importErrorMessage>Cannot import the Datatel.Portal.WebPart.UnreadMessages.UnreadMessages Web Part.</importErrorMessage> </metaData> <data> <properties> <property name="Title" type="string">Unread Mail</property> <property name="ChromeType">Default</property> </properties> </data> </webPart> </webParts>]]> </AllUsersWebPart>
Existing text
66
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
67
68
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Styling Procedures
Styling My Sites
In This Chapter
This chapter contains a series of procedures that you will need to perform as you style and customize your Datatel Portal My Sites. Table 16 lists the topics covered in this chapter.
Table 16: Topics in This Chapter Topic
Understanding My Sites Disabling the Datatel Theme on My Sites Creating My Sites with a Custom Theme Applying a Theme to Existing My Sites 70 71 72 78
Page
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
69
Understanding My Sites
A My Site is a personal space where a user can save documents and share their work with others, if desired. Datatel My Sites styling takes advantage of the SharePoint 2010 theming framework. A Datatel-delivered theme is enabled and applied to all My Sites that you create after installing the Datatel Portal software. See Figure 28 for a My Site with the Datatel theme colors applied.
Note: See Disabling the Datatel Theme on My Sites on page 71 if you want to disable the Datatel My Site theme styling.
If you decide to keep My Sites available for your constituencies, you can provide users with a customized My Site theme using the steps in Creating My Sites with a Custom Theme on page 72 (or you can continue to use the default My Site theme page that uses colors from the main Client portal).
Note: The Datatel custom theme (Datatel.thmx) coordinates with the Datatel Portal look and feel.
70
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Step 1. Access the SharePoint server and open a command prompt (cmd.exe).
Step 2. Execute the uninstall command as shown below. C:\Program Files\Common Files\Microsoft Shared\web server extensions\14\BIN\stsadm.exe -o uninstallfeature -filename DatatelMySiteThemeStapling\feature.xml
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
71
Page
Before performing these procedures, create your custom theme as described in Creating Custom Themes on page 30. Make sure this theme is deployed as a feature as described in Deploying a Custom Theme as a Feature on page 31.
72
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Step 3. Locate and click User Profile Service Application in the list.
Step 5. Note the URL in the My Site Host location field (Figure 29) and record it below. __________________________________________________________
Figure 29: URL for My Site
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
73
Step 1. In a browser, access My Sites host page as an administrator. Use the URL that you determined in Determining the My Sites Host URL on page 73.
Step 2. .At the left end of the SharePoint ribbon, click Site Actions and then Site Settings.
Step 4. On the Site Theme page, select your custom theme (Figure 30).
74
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
You may decide to use a custom theme as the default for all new My Sites. To apply a custom theme to users My Sites, you must staple it to the standard SharePoint My Site template. Stapling allows you to add features to a template without actually touching the template at all, so there is no risk of your changes being overwritten by future updates to the My Site template. Perform the steps below to staple your custom theme to the My Site template. Any personal My Sites created after you perform this procedure will use the custom theme.
Step 1. Access the SharePoint server and navigate to the following location: C:\Program Files\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\FEATURES
Step 3. In the new folder, use a text editor to create a new file.
Note: You will need a unique ID (GUID) for your feature. You can use Visual Studio to generate a new GUID. Otherwise, you can Google GUID Generator for an online generator to use.
<?xml version=1.0 encoding=utf-8 ?> <Feature Id=Your unique guid here Title="My Site Theme Stapling" Description=My Site Theme Stapling Version="12.0.0.0" Scope=Farm Hidden=TRUE xmlns=http://schemas.microsoft.com/sharepoint/> <ElementManifests> <ElementManifest Location=basesitestapling.xml/> </ElementManifests> </Feature>
Step 5. Make a note of your unique GUID (featureid) for use in the next procedure.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
75
Step 7. In the D01MySiteThemeStapling folder, use a text editor to create another file.
Step 8. Add the following text to the file, replacing the custom theme name with the one you creating using the procedure in Creating Custom Themes on page 30. Replace the GUID with the one you created when you implemented your custom theme as a feature (featureid) in Deploying a Custom Theme as a Feature on page 31.
Technical Tip: For a custom THMX file to be applied to My Sites, the custom theme must be implemented as a feature.
<Elements xmlns=http://schemas.microsoft.com/sharepoint/> <FeatureSiteTemplateAssociation Id=CC18EFD1-3A05-409a-B8DF-99B47C565035 TemplateName=SPSPERS#0 > <Property Key=Datatel2010CustomTheme Value=Your custom theme here /> <Property Key=CustomThemeFeatureIdToActivate Value=GUID for the custom theme feature /> </FeatureSiteTemplateAssociation> <FeatureSiteTemplateAssociation Id=CC18EFD1-3A05-409a-B8DF-99B47C565035 TemplateName=SPSMSITEHOST#0 > <Property Key=Datatel2010CustomTheme Value=Your custom theme here /> <Property Key=CustomThemeFeatureIdToActivate Value=GUID for the custom theme feature /> </FeatureSiteTemplateAssociation> </Elements>
Step 10. Reset IIS by entering the iisreset command at the command line.
76
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Step 11. Install the new feature by running the following stsadm command. Replace D01MySiteThemeStapling with the name of your feature folder. If this is a new feature, run:
If you just updated your custom feature to change the theme ID, run:
Technical Tip: If your My Site site or personal sites were created before the above two features were installed and activated, you will need to activate them manually for those sites.
Step 12. To test the changes, log into SharePoint as a user who has never been to this particular My Site.
Figure 31: Logging into My Site
A new My Site personal site will be created for the user based on the custom theme look and feel.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
77
Your portal might have existing personal My Sites to which you want to apply the Datatel theme or a custom theme. Examples include: After you implemented the Portal and some users created My Sites, you decide to create a custom theme. The procedure below applies your custom theme to the existing My Sites. You migrated to Portal 3.0 from Portal 2.6.x. Any My Sites would have been migrated but would have no theme applied. You can use the procedure below to apply either the Datatel theme or your own custom theme to those migrated My Sites. Perform the procedure below to apply a theme to existing My Sites.
Step 2. In Windows PowerShell, enter the following command to enable the theme feature on the My Sites host:
Enable-SPFeature -identity "custom_theme" -URL MySitesHostURL
For custom_theme, substitute Datatel Themes if you are applying the Datatel-delivered theme, or substitute the name of your custom theme if you are applying your custom theme (this is name of the folder directly under the Features folder). For MySitesHostURL, substitute the URL that you determined in Determining the My Sites Host URL on page 73. Example for the Datatel theme:
Enable-SPFeature -identity "Datatel Themes" -URL http://sdsp10w8wfe:80/my/
78
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Step 3. Enter the following commands to enable the theme feature on individual My Sites: a. First command, entered all on one line:
$personalSites = get-spsite MySitesHostURL/* -Limit ALL | where {$_.RootWeb.WebTemplate -eq "SPSPERS"}
Example:
$personalSites = get-spsite http://sdsp10w8wfe:80/my/* -Limit ALL | where {$_.RootWeb.WebTemplate -eq "SPSPERS"}
Step 4. Enter the following command, all on one line, to enable the DatatelMySiteThemeReceiver feature on the My Sites host:
Enable-SPFeature -identity "DatatelMySiteThemeReceiver" -URL MySitesHostURL
Example:
Enable-SPFeature -identity "DatatelMySiteThemeReceiver" -URL http://sdsp10w8wfe:80/my/
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
79
Step 5. Enter the following commands to enable the DatatelMySiteThemeReceiver feature on individual My Sites: a. First command, entered all on one line:
$personalSites = get-spsite MySitesHostURL/* -Limit ALL | where {$_.RootWeb.WebTemplate -eq "SPSPERS"}
Example:
$personalSites = get-spsite http://sdsp10w8wfe:80/my/* -Limit ALL | where {$_.RootWeb.WebTemplate -eq "SPSPERS"}
80
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Appendices
Appendices
Hexadecimal
FF0000
RGB
R 255, G 0, B 0
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
83
Planning Worksheet
Use the planning worksheet (Table 18) to record your choices of colors including the conversions from hexadecimal numbers to RGB values.
Note: The values contained in Datatel-delivered colors are included in the worksheet for your convenience. See Modifying Datatel Theme Colors on page 24 for more information.
Hexadecimal
RGB
84
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Appendices
In This Appendix
This appendix contains frequently asked questions and proposed solutions to those questions in addition to some tips on how to style your portal more easily and efficiently. Table 19 lists the topics covered in this chapter.
Table 19: Topics in This Appendix Topic
Frequently Asked Questions (FAQs) Tips and Tricks 86 88
Page
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
85
Q Why would I implement my custom theme as a feature? A If you have multiple site collections and do not want to repeat steps for
each gallery, then you can implement your custom theme as a feature. After it is implemented, you activate the feature for a site collection where you need it. If you are implementing My Sites, your custom theme must be implemented as a feature to be readily available to the newly provisioned personal sites.
Q How can I quickly test out my custom theme for just one test site collection
without installing it as a feature?
Q Why am I not able to see my custom theme listed in the Site Settings >
Look and Feel > Site Theme list of themes after installing it as a feature?
A Make sure you activate your feature. Go to Site Settings > Site collection
administration > Site Collection Features to make sure your custom theme is activated.
86
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
A If you have applied site themes, your changes may not appear
immediately because SharePoint caches themed stylesheet files. Go to Central Administration and select Manage web applications under the Application Management category. Select your web application in the list and click on Manage Features. For the Datatel Refresh Themes entry, click to Activate. If it is already activated, then click to Deactivate and then Activate.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
87
88
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
each batch of testing makes it easier to manage the newly created sites. After you are satisfied with the changes, delete the test site collection and create a new one for further testing. This helps to keep the main test site collection clean without hundreds or thousands of test sites that were created for the sole purpose of testing a new or modified site template. Internet Explorer Developer Tools: Part of making changes to CSS files involves knowing which classes to change to modify each element on the page. To find out which classes are associated with each HTML tag, you would typically open the page and examine the source code to find out which style class you should be touching. We recommend using the Microsoft tools for Internet Explorer that make this task easier. To open the IE Developer Tools, start a new browser session and go to Tools > Developer Tools. This tool allows you to be able to see a web page and the HTML code for the page side by side. If you click on Select Element by clicking the arrow icon from the tool bar, you can click anywhere on the page and it shows what the HTML code for that segment looks like.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
89
For example, if you are making changes to your main stylesheet file, save a copy of the file in the production server before overwriting it with a new version. You can save this temporary copy in a folder called old somewhere in your server. Include the date of the update as part of the name of the file, for example, D01CSSMAIN_10_13_2011.css. You can delete all files from this old folder periodically; after you are certain the changes you applied to production were not disruptive. If a change causes pages to stop working or you run into other issues, then restore the file to the version prior to the last update.
90
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.
91
92
Styling the Datatel Portal (SharePoint 2010), February 15, 2011 2011 Datatel, Inc.