テーマはユーザインターフェイス (UI) の重要な要素で、外観の一貫性を維持し、特定のロケールを反映します。テーマを編集して、文化的イメージとフォントを取り入れることができます。

また、別の場所のユーザインターフェイスから画像の追加や色の変更が行えます。

  • 管理者はデフォルトのブランドをカスタマイズして、教育機関の文化的アイデンティティを強化できます。
  • 管理者は[テーマとパレットカタログ]を使用して、Blackboard Learn全体で使用される色を変更できます。
  • 教員は[コーススタイル]ツールを使用して、ロケールを強調できるバナー画像の追加などにより、コースをカスタマイズできます。

このセクションでは、テーマをダウンロードして編集する方法と、テーマの編集に使用する推奨ツールについて、詳しく説明します。

Blackboard Learn SP10では次の3つのレガシテーマが廃止されました。Blackboard Classic、WebCT Classic 1、および WebCT Classic 2。SP9以降のデフォルトブランドで、これらのテーマのいずれかを使用し続けている場合は、アップグレード時にシステムのカスタムテーマに変換されます。

テーマの編集

Blackboard Learnからダウンロードしたテーマを編集して、システムの外観を変更できます。各テーマには関連付けられたカスケーディングスタイルシート(CSS)があり、これによってUIの表示方法が決定されます。フォントサイズやタイプなどの特性、背景画像、その他のXHTML要素はCSSによって記述されます。Mozilla® Firefox® WebブラウザとFirefoxアドオンのFirebug®を使用して、ユーザは個々のCSS要素をUIから直接簡単に識別できます。

以下の手順を実行する前に、FirefoxとFirebugの最新バージョンをダウンロードしてインストールしてください。

FirefoxとFirebug

Firefoxには、サードパーティが開発したプログラムが多数あります。この中にはFirebugがあり、Webページで使用されているCSS、HTML、JavaScriptの編集、デバッグ、監視に使用されています。要素が特定されたら、CSSエディタを使用して要素を検索し、テーマのCSSを変更できます。

Firefoxのインストール

  1. http://www.mozilla.comに移動します。
  2. (オプション) 英語以外の場合は、使用する言語を選択します。
  3. 緑のダウンロードボタンを選択します。
  4. インストールの手順に従います。
  5. デスクトップからFirefoxを開きます。

Firebugのインストール

  1. Firefoxを開きます。
  2. [ツール]メニューを開いて、[アドオン]を選択します。
  3. [アドオンを入手]を選択します。
  4. 検索ボックスにFirebugと入力して、[検索]を選択します。
  5. Firebugアイコンを選択します。
  6. [インストール]を選択します。Firefoxから、インストールの完了後にブラウザを再起動するようメッセージが表示されます。
  7. [はい]を選択します。

Firebugの使用

Firebugを使用して既存のCSSを確認し、変更が必要なすべての要素を突き止めます。

  1. Firefoxを開きます。
  2. 下部のステータスバーの右側にあるFirebugアイコンを選択します。
  3. [調査]を選択します。
  4. 検査するページの領域の上にマウスを移動します。
  5. 領域を選択してその位置を維持します。
  6. Firebugコンソール内のXHTML要素の上にマウスを置きます。
  7. XHTMLノードを選択して、XHTML要素の説明を展開または最小化します。
  8. Firebugコンソールの右側で選択した、関連するCSSクラスまたは要素のIDを表示します。
  9. クラスまたはID名をコピーします。
  10. クラスまたはID名をCSSエディタに貼り付けて、この要素を検索します。
  11. 適切な変更を加えます。
  12. 終了したらCSSを保存します。

テーマのCSSをダウンロードして編集

CSS要素が特定されたら、テキストエディタを使用してCSSを編集できます。

  1. 管理パネルから[ブランドとテーマ]をクリックします。
  2. [テーマとパレットカタログ]を選択します。
  3. 適当なテーマでメニューを開き、[ダウンロード]を選択します。
  4. ZIPパッケージを保存します。
  5. ZIPパッケージを開いて、コンテンツを安全な場所に展開します。
  6. テキストエディタを使用してtheme.cssファイルを開きます。
  7. 必要な変更を行い、CSSファイルを保存します。
  8. コンテンツのバックアップをZIP圧縮してローカルコンピュータに保存します。
  9. [管理パネル]に戻り、[ブランドの初期設定]を選択します。
  10. [テーマとパレットカタログ]を選択します。
  11. [テーマの作成]を選択します。
  12. テーマに名前と参照名を付けます。必要に応じて、説明を追加します。
  13. [マイコンピュータの参照]を選択し、新しいZIPパッケージを探して選択します。
  14. [送信]を選択します。

CSSの例

ここでは、Blackboard Learnに付属する校舎テーマの例を紹介します。ヘッダースタイルの定義と、フォントファミリ設定を示します。

* {font-family: Cursive, Georgia, Times, serif;}

/* a:focus { Removes focus outline in Firefox (Mozilla) outline:none;

} */

img { /* Centers images vertically and sets borders to 0 */

vertical-align:middle;

border:0px;

}

.hideme {

display:none!important;

}

h1 { /*Equals 19px*/

font-size:148%;

}

h2 {

font-size:123.1%;

}

h3 {

font-size:108%;

}

h1,h2,h3 {

margin:1em 0;

}

h1,h2,h3,h4,h5,h6,strong {

font-weight:bold;

}

システムテーマとコーステーマ

教員が自分のコースのルックアンドフィールを変更できるコーステーマはService Pack 8で導入されました。コーステーマは、システムテーマとは別のものです。教員がコーステーマをコースで使用できるようにするには、[管理パネル] > [コース設定] > [コーステーマおよびアイコン]と移動し、[コーステーマの有効化]チェックボックスを選択します。

教員によるコーステーマの使用方法の詳細

新しいシステムテーマには、システムの参照名に基づく名称のPNGサムネイル画像を指定する必要があります。このファイルが見つからない場合、コーステーマリストに、画像が見つからないことを示すシンボルがデフォルトとして表示されます。新しいシステムテーマにこの画像を作成するための最も簡単な方法は、as_2012テーマに含まれているas_2012.pngという画像の名前を、新しいシステムテーマの参照名に変更することです。この画像の機能はデフォルトのコーステーマが使用されていることを示すことであり、そのテーマがどのようなデザインかを示すためのものではないので、このファイルの名前を変更することで、画像が見つからないことを示すシンボルがユーザインターフェイスに表示されることを防止できます。

カスタムシステムテーマと新しいBuilding Blockのインストール

カスタマイズされたシステムテーマを使用している場合に、ソフトウェア更新を通じてインストールしたBuilding Blockに含まれる新しいページにも カスタマイズを適用したいことがあります。このようにインストールされたBuilding Blockに必ずツール固有のスタイルシートが含まれているわけではありませんが、含まれていることもあります。

1つ以上のカスタムテーマがあるシステムに、独自のスタイルシートが含まれているBuilding Blockをインストールすると、インストール中に受信情報が表示されます。この受信情報では、Learnのアップグレード時と同様に、カスタムテーマに対して機能の確認を行うことが推奨されます。このメッセージは、カスタムテーマがシステムにすでにインストールされている場合に表示されます (そのテーマが現在使用されていない場合を含む)。

Building Blockにツール固有のスタイルシートが含まれているかどうかの情報は、どのBuilding Blockに関するものでも管理パネルにあります。[Building Blocks]セクションで、[Building Blocks]を選択してから[インストールされているツール]を選択します。リストされている任意のBuilding Blockのメニューを開いて、[コンポーネントの表示]を選択します。Building Blockに含まれているツール固有スタイルシートの中に、Learnに付属するいずれかのテーマに対応するものがある場合、このページにテーマハンドルがリストされます。

パッケージのコピーをオフラインで保存してカスタムテーマを管理する場合には、SP 14へのアップグレード後に、管理パネルUIからオフラインのカスタムテーマパッケージをダウンロードして更新します。それによって、そのService Packで導入された新しいパッケージ構造のコピーを取得できます。スタイルシート自体は変更されず、カスタマイズワークフローに対するその他の変更も行われません。ただしSP 14へのアップグレード後は、以前のパッケージ構造内のオフラインパッケージはアップロードできなくなり、エラーメッセージが表示されます。