概要
Yellowfinは、ヘッダーおよびフッターパネルを削除または置き換えることで、既存または新しいアプリケーションとの統合が可能です。また、この操作によって独自のナビゲーションをカスタマイズしたパネル内に組み込むことができます。
ログインページと同様に、標準のYellowfinヘッダーおよびフッターのカスタマイズは次の2つの方法で実行できます。
- シンプル - イメージの置き換えおよびヘッダーおよびフッターに使用されているCSSファイルの変更を伴います。パネルを記述する必要はありません。一般的に、このオプションは簡易的なモックアップに使用され、スタイルが変更された最終版としては使用されません。
- 完全 - カスタムファイルを記述してヘッダーおよびフッターパネルを置き換える作業を伴います。この方法は高度な技術的知識および時間を必要とします。
ヘッダー
Yellowfinヘッダーはシステム内の各ページの上部に位置します。
フッター
フッターはページの下部に位置し、ダッシュボードの位置が中央揃えに設定されている場合はダッシュボードの中央で位置揃えされます。
例
一時的なカスタムヘッダーおよびカスタムフッターを簡易的に作成する場合、YellowfinのROOTのcustomimagesディレクトリ(Yellowfin\appserver\webapps\ROOT\customimages
)で以下のイメージをカスタマイズしたバージョンと置き換えます:
- header_logo.gif
- logoFooter.png
これらのイメージを置き換えたら、新しいイメージが表示されるようにブラウザーのキャッシュをクリアする必要があります。
注意:置き換えとして使用するイメージは、上記のファイルと同じ名前にしてページで使用されるようにする必要があります。オリジナルを上書きする必要はなく、単に新しいイメージをカスタムディレクトリに配置します。これにより、新しいイメージはアップグレードプロセス時に上書きされません。
例
コンポーネント | 標準 | カスタム |
---|---|---|
ヘッダー全体 | ||
フッター全体 | ||
header_logo.gif | ||
logoFooter.png |
完全
作成方法
含まれるHTMLは、完全なHTMLドキュメント自身ではなく、別のHTMLページにインラインで含めるための構成要素である必要があります。つまり、<HTML>、<HEAD>、または<BODY>タグを含めることはできません。このHTML内のすべてのリンクは、すべてYellowfinページに対して相対的となります。絶対的なHTMLリンクを使用することをお勧めします。
標準のYellowfinヘッダーには、ユーザーがシステムからログアウトするための1つのリンクのみが提供されていることに留意することも重要です。置き換えたヘッダーでこのリンクを提供する場合は、次を含めます。
javascript:on_submit('logoff');
Yellowfinのサンプルディレクトリ(Yellowfin\development\examples\CustomHeaderExample.jsp
)には、サンプルのヘッダーファイルが含まれており、これを使用してカスタムヘッダーの作成を開始できます。
- カスタムのヘッダーおよびフッターファイルをYellowfinのROOTディレクトリ(
Yellowfin\appserver\webapps\ROOT
)に保存します。 - 必要なすべてのイメージをYellowfinのcustomimagesディレクトリ(
Yellowfin\appserver\webapps\ROOT\customimages
)に保存します。 - 使用するすべてのCSSファイルを更新するか、新しいCSSファイルをYellowfinのcustomcssディレクトリ(
Yellowfin\appserver\webapps\ROOT\customcss
)に追加します。 - Yellowfinで、「管理」>「設定」>「インテグレーション」(タブ)に移動します。
ここで、カスタムファイルの場所を指定します。たとえば、次のように指定します。
- 「ページヘッダー」オプションを、「標準ヘッダー」から「カスタムヘッダー」に変更して、ヘッダーファイルのURLを指定します。
- 「ページフッター」オプションを、「標準フッター」から「カスタムフッター」に変更して、フッターファイルのURLを指定します。
カスタムURLは、毎回ページが読み込まれるときの実行時に含まれるHTML構成要素へのリンクです。この構成要素は、Yellowfinサービスがアクセス可能な任意のサーバーに配置できますが、最高のパフォーマンスを得るために、同一のサーバー上に配置することをお勧めします。この例では、構成要素ファイルをYellowfinのROOTディレクトリ(Yellowfin\appserver\webapps\ROOT\header.jsp
)に配置し、header.jsp
を介して見つかるようにしています。
注意:既存のYellowfinディレクトリを使用せずに、Yellowfin\appserver\webapps\ROOT
内に新しいフォルダーを作成してカスタムファイルを格納し、これらのファイルを簡単に特定できるようにすることも可能です。
例
コンポーネント | 標準 | カスタム |
---|---|---|
ページ全体 |