Versions Compared

Version Old Version 3 New Version 4
Changes made by

Yellowfin Admin

Yellowfin Admin

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Wiki Markup
{anchor:top}
{toc: class=contents}

h2. Overview概要
{styleclass: Class=topLink} [topページトップ|#top] {styleclass}
YellowfinYellowfinは、ヘッダーおよびフッターパネルを削除または置き換えることで、既存または新しいアプリケーションとの統合が可能です。また、この操作によって独自のナビゲーションをカスタマイズしたパネル内に組み込むことができます。
can
be integrated into existing or new applications by removing or replacing the Header and Footer panels. This also allows you to build in your own navigation into customised panels.

Much like the Login Page, customisation of the standard Yellowfin Header & Footer can be performed two ways:

# *Simple* - this involves the replacement of images, and changes to the CSS files used by the header and/or footer, without having to write a panel. Generally this option is used for quick _'mock ups'_ but not the final restyled product.
# *Complete* - this involves writing a custom file to replace the header and/or footer panel. This method requires more technical knowledge, and more time.

h3. Header
The Yellowfin header sits at the top of each page in the system: 

ログインページと同様に、標準のYellowfinヘッダーおよびフッターのカスタマイズは次の2つの方法で実行できます。


# *単純* \- イメージの置き換えおよびヘッダーおよびフッターに使用されているCSSファイルの変更を伴います。パネルを記述する必要はありません。一般的に、このオプションは簡易的なモックアップに使用され、スタイルが変更された最終版としては使用されません。
# *完全* \- カスタムファイルを記述してヘッダーおよびフッターパネルを置き換える作業を伴います。この方法は高度な技術的知識および時間を必要とします。

h3. ヘッダー

Yellowfinヘッダーはシステム内の各ページの上部に位置します。
!03standardHeader.png|thumbnail,border=1!

h3. Footerフッター
The footer is located at the bottom of the page, and is centred on the Dashboard if the dashboard position is set to *Centre*:
フッターはページの下部に位置し、ダッシュボードの位置が{*}中央揃え{*}に設定されている場合はダッシュボードの中央で位置揃えされます。
!04standardFooter.png|thumbnail,border=1!


h2. Simple単純
{styleclass: Class=topLink} [topページトップ|#top] {styleclass}
If you wish to create a quick, temporary custom header & footer, simply replace the following images in the Yellowfin ROOT *customimages* directory ({{Yellowfin一時的なカスタムヘッダーおよびカスタムフッターを簡易的に作成する場合、Yellowfinの「ROOT」の「*customimages*」ディレクトリ（Yellowfin\appserver\webapps\ROOT\customimages\}}) with your customised versions:customimages）で以下のイメージをカスタマイズしたバージョンと置き換えます：

# header_logo.gif
# logoFooter.png

You will need to clear your browser cache once replacing these images in order for them to appear.これらのイメージを置き換えたら、新しいイメージが表示されるようにブラウザーのキャッシュをクリアする必要があります。


{color:#CC0000#cc0000}{*Note}注意:*{color} 置き換えとして使用するイメージは、上記のファイルと同じ名前にしてページで使用されるようにする必要があります。オリジナルを上書きする必要はなく、単に新しいイメージをカスタムディレクトリに配置します。これにより、新しいイメージはアップグレードプロセス時に上書きされません。
the images you wish to use as replacements will need to have the same name as the files listed above in order for the page to pick them up. You no longer have to overwrite the originals, simply place your new images in the custom directory. This will mean that they will not be overwritten during the upgrade process.

h3. Example

||Component||Standard||Custom||
|Full Header|
h3. 例

|| コンポーネント \\ || 標準 \\ || カスタム \\ ||
| ヘッダー全体 \\ | !simpleStandardHeader.png|thumbnail,border=1! | !simpleCustomHeader.png|thumbnail,border=1! |
|Full フッター全体 \\ Footer| !simpleStandardFooter.png|thumbnail,border=1! | !simpleCustomFooter.png|thumbnail,border=1! |
| header_logo.gif | !header_logo.gif! | !clogo.gif! |
| logoFooter.png | !logoFooter.png! | !clogoFooter.png! |


h2. Complete完全
{styleclass: Class=topLink} [topページトップ|#top] {styleclass}

h3. Instructions作成方法
The
included含まれるHTMLは、完全なHTMLドキュメント自身ではなく、別のHTMLページにインラインで含めるための構成要素である必要があります。つまり、<HTML>、<HEAD>、または<BODY>タグを含めることはできません。このHTML内のすべてのリンクは、すべてYellowfinページに対して相対的となります。絶対的なHTMLリンクを使用することをお勧めします。
HTML
should he a fragment, suitable for including inline within another HTML page, rather than it being a full HTML document itself. That is, it should NOT contain <HTML>, <HEAD>, or <BODY> tags. Remember that any links inside the HTML will be relative to the Yellowfin page. It is recommended to use absolute HTML links.

It is also important to remember that the standard Yellowfin Header provides only one link for a user to log out of the system. If the header is being replaced and you wish to provide this link, include:

標準のYellowfinヘッダーには、ユーザーがシステムからログアウトするための1つのリンクのみが提供されていることに留意することも重要です。置き換えたヘッダーでこのリンクを提供する場合は、次を含めます。

{code:language=javascript}
javascript:on_submit('logoff');
{code}

There is also a sample header file available as a starting point in the Yellowfin Examples directory ({{YellowfinTYellowfinの「examples」ディレクトリ（Yellowfin\development\examples\CustomHeaderExample.jsp}}).jsp）には、サンプルのヘッダーファイルが含まれており、これを使用してカスタムヘッダーの作成を開始できます。

# Save your custom Header & Footer files in the Yellowfin ROOT directory ({{YellowfinカスタムのヘッダーおよびフッターファイルをYellowfinの「ROOT」ディレクトリ（Yellowfin\appserver\webapps\ROOT\}})ROOT）に保存します。
# Save any required images in the Yellowfin 必要なすべてのイメージをYellowfinの「*customimages* directory ({{Yellowfin」ディレクトリ（Yellowfin\appserver\webapps\ROOT\customimages\}})customimages）に保存します。
# Update any CSS files used, or add new ones to the Yellowfin 使用するすべてのCSSファイルを更新するか、新しいCSSファイルをYellowfinの「*customcss* directory ({{Yellowfin」ディレクトリ（Yellowfin\appserver\webapps\ROOT\customcss\}})customcss）に追加します。
# In Yellowfin, navigate to *Administration* > *Configuration* > *Integration* (tab)
Here you will need to specify the locations of your custom files, for example:
Yellowfinで、「*管理*」>「*設定*」>「*インテグレーション*」（タブ）に移動します。
ここで、カスタムファイルの場所を指定します。たとえば、次のように指定します。
!integrationOptions.png|thumbnail,border=1!
## Change the *Page Header* option from *Standard Yellowfin Header* to *Custom Header* and specify the URL of the file.
## Change the *Page Footer* option from *Standard Yellowfin Footer* to *Custom Footer* and specify the URL of the file.

The Custom URL is a link to the html fragment that will be included at runtime every time a page is loaded. It can be located on any server that the Yellowfin service can access, but for best performance it would be hosted on the same server. In this example we have placed the file in the Yellowfin ROOT directory ({{Yellowfin「*ページヘッダー*」オプションを、「*標準ヘッダー*」から「*カスタムヘッダー*」に変更して、ヘッダーファイルのURLを指定します。
## 「*ページフッター*」オプションを、*「標準フッター*」から「*カスタムフッター*」に変更して、フッターファイルのURLを指定します。

カスタムURLは、毎回ページが読み込まれるときの実行時に含まれるHTML構成要素へのリンクです。この構成要素は、Yellowfinサービスがアクセス可能な任意のサーバーに配置できますが、最高のパフォーマンスを得るために、同一のサーバー上に配置することをお勧めします。この例では、構成要素ファイルをYellowfinの「ROOT」ディレクトリ（Yellowfin\appserver\webapps\ROOT\header.jsp}} and can then be found via {{header.jsp}}

{color:#CC0000}*Note:*{color} instead of using the existing Yellowfin directories, you may wish to create a new folder in {{Yellowfinjsp）に配置し、header.jspを介して見つかるようにしています。


{color:#cc0000}{*}注意:*{color}&nbsp;既存のYellowfinディレクトリを使用せずに、Yellowfin\appserver\webapps\ROOT\}}ROOT内に新しいフォルダーを作成してカスタムファイルを格納し、これらのファイルを簡単に特定できるようにすることも可能です。
to
containh3. your例
custom
files,|| toコンポーネント make\\ locating|| them標準 easier.\\ || h3.カスタム Example\\ ||Component||Standard||Custom||
| ページ全体\\ |Full Page|!01standard.png|thumbnail,border=1! | !02custom.png|thumbnail,border=1! |

\\
\\
{horizontalrule}
{styleclass: Class=topLink} [topページトップ|#top] {styleclass}