コンテンツにスキップ

クイックアクセス

概要

ダッシュボードにクイックアクセスを追加します。設定したサイト(フォルダ、テーブル、Wiki、ダッシュボード)へのリンクを一覧表示します。

設定手順

全般タブ

クイックアクセスの設定画面の全般タブ

項目名 説明
タイトル パーツの名称です。
タイトルを表示する タイトルを表示させる場合にチェックします。
サイトID 表示したいサイトID、サイト名、サイトグループ名をカンマ区切りで入力します。入力した順番で表示します。トップ画面を指定する場合は0を入力してください。JSON形式での入力も可能です。
レイアウト クイックアクセスパーツのレイアウトを選択します。
非同期読み込みしない このチェックボックスにチェックを付けた場合、非同期読み込みの設定に関わらず非同期読み込みを行いません。非同期読み込みの設定についてはダッシュボード機能:パーツの追加を参照ください。
CSS クイックアクセスパネルの要素にCSSを適用する場合に使用します。CSSクラス名を指定することで、各項目に任意のクラス名を指定し、スタイルを適用することができます。

アクセス制御タブ

クイックアクセスの設定画面のアクセス制御タブ

クイックアクセスに対する参照権限を設定します。参照権限のないユーザがダッシュボードを開いた場合、このパーツは非表示となります。

表示内容

サイトのアイコン

サイトIDで指定したサイトの種類に応じてサイト名の前に自動的にアイコンが表示されます。後述するJSON形式によるサイトIDの指定でアイコンを変更することができます。

サイト種別 アイコン
フォルダ 「フォルダ」のアイコン
期限付きテーブル 「期限付きテーブル」のアイコン
記録テーブル 「記録テーブル」のアイコン
Wiki 「Wiki」のアイコン
ダッシュボード 「ダッシュボード」のアイコン

サイト種別ごとのアイコンが付いたクイックアクセスの表示例

レイアウト

レイアウトは縦方向、横方向のいずれかを選択します。

レイアウト 内容
縦方向 サイトを縦に並べて表示します。パーツ自体の高さを狭くすると縦スクロールバーが表示します。
横方向 サイトを横に並べて表示します。パーツ自体の幅を狭くすると折り返して表示します。

レイアウトが縦方向のクイックアクセスの表示例

レイアウトが横方向のクイックアクセスの表示例

JSON形式によるサイトID指定

JSON形式でサイトIDを指定することで、表示サイト毎にアイコンの変更やサイトごとにCSSを指定することができます。

項目名 説明
Id サイトIDを指定します。Urlが設定されていない場合は必須です。Urlが設定されている場合は無視されます
Url 任意のリンク先をURLで指定します。Idが設定されていない場合は必須です
Icon サイト名の前に表示するアイコンを設定します。指定文字はMaterial Symbols(※1)を参照してください。Iconは省略可能です。省略時はサイトのアイコンの内容で表示します
Css cssのクラス名を設定します。あらかじめスタイルタブや「拡張CSS」にて指定したクラスに対してスタイルを設定してください。Cssは省略可能です
Title ボタンのキャプションとして表示する文字列を設定します。Titleは省略可能です。省略時はサイトIDを指定した場合はサイト名、Urlを指定した場合はUrlが表示されます
ViewMode 表示するサイトのViewModeを指定します。ViewModeは省略可能です。詳細は下記ViewModeの項目を参照してください
OpenInNewTab リンク先を新しいタブで開く場合にtrueを設定します。OpenInNewTabは省略可能です。省略時はfalseとなります

ViewMode

ViewModeに指定可能な値は下記の通りです。

表示 ViewMode
一覧 Index
カレンダー Calendar
クロス集計 Crosstab
ガントチャート Gantt
バーンダウンチャート Burndown
時系列チャート Timeseries
分析チャート Analy
カンバン Kamban
画像ライブラリ Imagelib

設定例

1つのサイトに対しカンバンで開くボタンと、カレンダーで開くボタンを追加する例です。また、どちらも「新しいタブで開く」設定としています。

[
    {
        "Id": 123,
        "Title": "WBS(カンバン)",
        "ViewMode": "Kamban",
        "OpenInNewTab": true
    },
    {
        "Id": 123,
        "Title": "WBS(カレンダー)",
        "ViewMode": "Calendar",
        "OpenInNewTab": true
    }
]

カンバンとカレンダーで開く2つのボタンを並べた表示例

サイトIDおよびCSSを以下のように設定した場合の表示結果は下記の通りです。

[
    {
        "Id": 123,
        "Icon": "check_circle",
        "Css": "bgcolorPink"
    },
    {
        "Id": 456,
        "Icon": "check_circle"
    },
    {
        "Id": 789,
        "Css": "bgcolorPink"
    }
]
1
2
3
.bgcolorPink {
      background-color: pink;
}
表示結果

アイコンと背景色のCSSを指定したクイックアクセスの表示結果

※1 Material Symbolsからの指定文字検索方法

JSON形式によるサイトIDの指定においてIconに設定する文字は以下手順で確認してください。

  1. Material Symbolsのページを開く

    Material Symbols のアイコン一覧ページ

  2. 利用したいアイコンをクリックする

    Material Symbols で利用したいアイコンを選んだところ

  3. 画面右に表示する「Inserting the icon」欄のspanタグに囲まれた文字列をIconに設定する。

    画面右の「Inserting the icon」欄に表示されるspanタグの文字列

対応バージョン

対応バージョン 内容
1.4.10.0 以降 JSON形式によるサイトID指定にUrl、Title、ViewMode、OpenInNewTabを追加

関連情報