Title: HTML の body タグに特別なクラスを追加 プラグイン

Proteus スキンのページ HTML の <body> タグに特別なクラスを追加できます。これにより、リクエストを行ったユーザーが特定のグループに所属しているかどうかや、特定のスペースにいるかどうかを判定できます。



インストール



下のリンクをクリックしてプラグインの .zip ファイルをダウンロードします。



サーバーセットアップ > プラグインのページの「新規プラグインのインストール」で .zip ファイルを選択してアップロードします。

アップロードが完了すると、「インストール済みプラグイン」の一覧に「I18N ERROR」が表示されますが、これはプラグイン中の日本語ファイルがまだ動作に反映されていないために表示されるエラーです。

サーバーセットアップ > 一般 > サーバー管理 の [TeamPage の再起動] ボタンをクリックして TeamPage を再起動してください。TeamPage の再起動が完了すると、このエラーは表示されなくなります。TeamPage クラウドでは再起動が2回必要です。

サーバーセットアップ > プラグイン のページを開き、[HTML の body タグに特別な class を追加] が表示されていることを確認します。

インストール完了

以上でインストールは完了です。

設定



プラグインの [設定] をクリックします。



下図のプラグイン設定画面が表示されます。



それぞれの設定項目で、いくつかの特別なクラス名を挿入するかどうかを選択できます。

グループ このグループに所属しているユーザーがページを表示すると、次の [グループのクラス] に記入した内容が、ページの <body> タグの class= 属性追加されます。
グループのクラス ここに記入された内容は、上の [グループ] 設定で選択されたグループに所属するユーザーがページを表示するとき、ページの <body> タグの class= 属性の値として追加されます。
スペース ID のクラスを挿入 ここで [はい] を選択すると、ページの <body> タグの class= 属性にスペースの ID が "project-N" として挿入されます。(スペースの ID が "5" の場合は "project-5" が挿入されます。)
閲覧ユーザーの ID のクラスを挿入 ここで [はい] を選択すると、ページの <body> タグの class= 属性に、閲覧中のユーザーの ID が "requesting-user-id-N" として挿入されます。(ユーザーの ID が "7" の場合は "requsting-user-id-7" が挿入されます。)
ビューの名前のクラスを挿入 ここで [はい] を選択すると、ページの <body> タグの class= 属性に「ビュー」(画面のこと)の名称が "view-something" として挿入されます。(タスク > プロジェクト のページを開くと、"view-tasks-projects" が挿入されます。)
ユーザーのプロフィールの ID のクラスを挿入 ここで [はい] を選択すると、ユーザーのプロフィール ページの <body> タグの class= 属性に、当該ユーザーの ID が "user-profile-id-N" として挿入されます。(ユーザーの ID が "5" の場合は "user-profile-id-5" が挿入されます。)


動作確認



ブラウザーで [F12] キーを押して開発者ツールを表示し、ページの <body> タグの class= 属性を確認します。

サンプル

例えば、「ユーザーがグループに所属していたら画面右上のロゴを隠す(非表示にする)」というカスタマイズを行うには、スキンのカスタマイズ設定または Download2143: Proteus カスタム JavaScript & CSS プラグイン で次のスタイルシート (CSS) を設定します。

/* ユーザーが指定されたグループのメンバーだったらロゴ画像を隠す */
body.special-group-member #logo-banner-top {
  display: none;
}




Attachments:
plugin1.png
plugin2.png
configurations.png
example.png
関連記事
Article: Download2227 (permalink)
Categories: :DocJp:プラグイン
Date: 2018/11/15; 10時48分26秒 JST

Author Name: TeamPage サポート
Author ID: jpbo