CookBook

ページ遷移後にグローバルナビを非表示にする方法

投稿日:2016-04-25 更新日:

このCookBookでは、ページ遷移後にグローバルナビを非表示にする方法について説明していきます。

特別な理由でページ遷移後にグローバルナビを非表示にしたい場合に利用してください。
また、iframeを利用する際にグローバルナビが不要な場合にも利用できます。

完成イメージ


1. はじめはグローバルナビが表示されています。
2. HeadWithContainerThemeBuilder のリンクをクリックする。
3. ページ遷移後はグローバルナビが表示されません。

完成サンプル

以下の完成サンプルをダウンロードしてご活用ください。

e builder プロジェクト : im_cookbook_111393_pagebuilder.zip
imm ファイル : im_cookbook_111393_pagebuilder-1.0.0.imm

ローカル環境で表示させる場合は、以下のURLにアクセスしてください。
http://localhost:8080/imart/im_cookbook/111393/page
なおベースURLである以下の部分は、環境に合わせて適宜変更してください。
http://localhost:8080/imart

レシピ

  1. ページ遷移するリンクを作成する
  2. 適用したいPageBuilderを、リクエストへのパラメータに指定する

1. ページ遷移するリンクを作成する

ページ遷移するリンクを作成します。

2. 適用したいPageBuilderを、リクエストへのパラメータに指定する

PageBuilderは、テーマモジュールのJSSPとコンテンツを組み合わせたHTMLを生成します。
PageBuilderは6つの実装があり、目的によってPageBuilderを使い分けてください。
詳しくは、以下のドキュメントをご覧ください。

適用したいPageBuilderを、リクエストへのパラメータとして指定してください。
今回は、PageBuilderの実装の1つであるHeadWithContainerThemeBuilderを利用しましょう。
HeadWithContainerThemeBuilderは、以下の特徴があります。

  • header(メニューやユーティリティ)が表示されない。
  • footer が表示されない。
  • HTMLの head タグが読み込まれるため、CSSやクライアントサイドJavaScriptが利用できる。

HeadWithContainerThemeBuilderを利用するためには、imui-theme-builder-moduleというキーに、headwithcontainerという値をリクエストパラメータとして指定してください。

作成したリンクをクリックしてページ遷移すると、グローバルナビは表示されません。

終わりに

このCookBookで利用したPageBuilderであるHeadWithContainerThemeBuilder以外にも、PageBuiderの実装があります。
また、設定ファイルを利用してPageBuilderを指定することも可能です。
詳しくは以下のドキュメントをご覧ください。

-CookBook
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

Forma標準アプリとIM-LogicDesignerを利用してBISワークフローの一括承認画面を作成する

このCookBookでは、Forma標準アプリとLogicDesignerを利用して、BISワークフローの一括承認画面を作成する方法を紹介します。 完成イメージ ① 承認を実施するフローとノードを設定 …

no image

Formaのスクリプトから処理対象者を制御するには

このCookBookでは、スクリプトを利用してIM-Workflowの動的ノード(動的承認、縦配置、横配置)の処理対象者を制御する方法をご紹介します。 スクリプトから動的処理対象者設定機能を利用するこ …

【ViewCreator】LogicDesignerと連携してデータ参照の一覧を表示するデータ参照を作成する方法

ViewCreator において、標準の「データ参照一覧」画面では以下のような変更ができません。 「説明」を一覧に表示する。 「データ参照名」の(初期表示時の)列幅を変更する。 各データ参照の表示画面 …

no image

EWS2017 「業務への適用イメージがすぐに湧く!  魔法の業務ロジック作成ツール『IM-LogicDesigner』実用例 10本勝負!」講演内容のご紹介

この記事では、EWS2017 Technology Track「業務への適用イメージがすぐに湧く!  魔法の業務ロジック作成ツール『IM-LogicDesigner』実用例 10本勝負!」での講演内容 …

no image

IMBox の「Like!」を別のキャプションにする方法

この Cookbook では、IMBox の「Like!」を別のキャプションにする方法を紹介します。 具体的には、「Like!」を「確認」に変更する方法を紹介します。 この Cookbook では、日 …

RSSRSSRSSRSS