Access Keys:
Skip to content (Access Key - 0)

This page is for generic hints rather than element specific hints. There are a number of things to make your life easier. Put your notes here, we will re-organize it as we get to critical mass

Resources and Bookmarks

Add Bookmarks and Resources here. See also the Bb Theme Elements Tip Sheet

Editing Hints and Notes

  • Quick Editing Build your theme on a local developer install to avoid having to re-upload through the UI. Find the custom theme files in blackboard/content/vi/<bbuid>/branding/<themename> You can make dynamic edits here and see the changes instantly. Blackboard clients typically have access to a developer edition copy upon request. Contact your client manager to activate your BbDN membership.
  • Firefox Web Developer A super handy plug-in for Firefox that makes CSS editing a snap. Use CSS > View Style Information form the toolbar and you can quickly locate the style setting for a particular element.
  • Firefox Add-On Firebug On the fly editing of your style sheet and view the location of the style. Similar as above.

The Top Frame

  • You can set the size of the top frame in the database. Thease are stored in the virtual_hosts table. The two attributes to set are the portal_row_height and course_row_height.
  • You can remove the "My Institution" logo image by hiding the brandingImgWrap element using display:none

The Login Page

  • The Login Page is a special case because it contains a block for custom text, plus various css elements. Looking at a Bb 9 page with the theme elements explained we see a number of elements:
    loginContainer The frame around the login element
    loginFormTitle The Tile text font
    gatewayButtons The Buttons for Preview / Create Account / Etc
    .loginImage The big image
    #loginText The custom login text screen
  • gateway.bb
    Editing this file will add custom text to the bottom block on your login page.
  • You can also control which buttons appear from "Gateway Options" on the "Admin Panel" tab.

Please attach sample login code to the Themes Showcase or provide other customization notes.

Language Packs

  • Don't forget with the language pack editor you can change any text on any page. Simply copy the default language pack for your starting point and create your own custom language pack.

General CSS Manipulation Hints

  • Common CSS tricks has some nice tips for common things to do with css.
  • Custom Fonts: Firefox and Safari will let you include font fils as part of your theme. IE doesn't support this yet.
  • Hide UI Elements: Put display:none; on any element in the CSS and watch it disappear. For example set display:none on brandingImgWrap and watch the "My Institution" banner vanish.

@media declaration.

The themes that ship by default with Blackboard do not include a media type declaration. The @media type in css will let you do all kinds of fun things to make your site look better on various browsers, and conditions. For example you can use @media print { } declarations to make pages print our more gracefully by hiding elements, changing fonts, etc. Another trick is use @media print {} to make assessment elements vanish during printing. For an example see the Themes Showcase

Adaptavist Theme Builder (4.1.3) Powered by Atlassian Confluence 3.3, the Enterprise Wiki