ダッシュボード機能:パーツの追加:クイックアクセス
## 概要
「[ダッシュボード](/manual/dashboard)」にクイックアクセスを追加します。設定したサイト(「[フォルダ](/manual/folder)」、「[テーブル](/manual/table)」、「[Wiki](/manual/wiki)」、「[ダッシュボード](/manual/dashboard)」)へのリンクを一覧表示します。
## 設定手順
### 全般タブ

|項目名|説明|
|:---|:---|
|タイトル|パーツの名称です。|
|タイトルを表示する|タイトルを表示させる場合にチェックします。|
|サイトID|表示したいサイトID、サイト名、サイトグループ名をカンマ区切りで入力します。入力した順番で表示します。トップ画面を指定する場合は0を入力してください。JSON形式での入力も可能です。|
|レイアウト|クイックアクセスパーツのレイアウトを選択します。|
|CSS|クイックアクセスパネルの要素にCSSを適用する場合に使用します。CSSクラス名を指定することで、各項目に任意のクラス名を指定し、「[スタイル](/manual/table-management-style)」を適用することができます。|
### アクセス制御タブ

クイックアクセスに対する参照権限を設定します。参照権限のないユーザがダッシュボードを開いた場合、このパーツは非表示となります。
<a id="site-icon"></a>
## 表示内容
### サイトのアイコン
サイトIDで指定したサイトの種類に応じてサイト名の前に自動的にアイコンが表示されます。後述する[JSON形式によるサイトIDの指定](#site-icon-by-json)でアイコンを変更することができます。
|サイト種別|アイコン|
|:---|:---|
|フォルダ||
|期限付きテーブル||
|記録テーブル||
|Wiki||
|ダッシュボード||

### レイアウト
レイアウトは縦方向、横方向のいずれかを選択します。
|レイアウト|内容|
|:---|:---|
|縦方向|サイトを縦に並べて表示します。パーツ自体の高さを狭くすると縦スクロールバーが表示します。|
|横方向|サイトを横に並べて表示します。パーツ自体の幅を狭くすると折り返して表示します。|
* レイアウト:縦方向

* レイアウト:横方向

<a id="site-icon-by-json"></a>
## JSON形式によるサイトID指定
JSON形式でサイトIDを指定することで、表示サイト毎にアイコンの変更やサイトごとにCSSを指定することができます。
|項目名|説明|
|:---|:---|
|Id|サイトIDを指定します。|
|Icon|サイト名の前に表示するアイコンを設定します。指定文字は[Material Symbols(※1)](#material-symbols)を参照してください。Iconは省略可能です。省略時は[サイトのアイコン](#site-icon)の内容で表示します。|
|Css|cssのクラス名を設定します。あらかじめ「CSS」タブや「拡張CSS」にて指定したクラスに対してスタイルを設定してください。Cssは省略可能です。|
### 設定例
サイトIDおよびCSSを以下のように設定した場合の表示結果は下記の通りです。
##### JSON
```
[
{
"Id": 123,
"Icon": "check_circle",
"Css": "bgcolorPink"
},
{
"Id": 456,
"Icon": "check_circle"
},
{
"Id": 789,
"Css": "bgcolorPink"
}
]
```
##### CSS
```
.bgcolorPink {
background-color: pink;
}
```
##### 表示結果

<a id="material-symbols"></a>
### ※1 Material Symbolsからの指定文字検索方法
JSON形式によるサイトIDの指定においてIconに設定する文字は以下手順で確認してください。
1. [Material Symbols](https://fonts.google.com/icons)のページを開く

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

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

## 関連情報
<div id="ManualList"><ul><li><a href="/manual/folder">フォルダ機能</a><span>2023/07/28 up</span></li></ul></article>
<ul><li><a href="/manual/table">テーブル機能</a><span>2023/04/12 up</span></li></ul></article>
<ul><li><a href="/manual/table-management-style">テーブルの管理:スタイル</a><span>2023/05/18 up</span></li></ul></article>
<ul><li><a href="/manual/wiki">Wiki機能</a><span>2023/05/18 up</span></li></ul></article>
<ul><li><a href="/manual/dashboard">ダッシュボード機能</a><span>2023/07/28 up</span></li>
<li><a href="/manual/dashboard-add-parts">ダッシュボード機能:パーツの追加</a><span>2023/08/24 up</span></li>
<li><a href="/manual/dashboard-timeline">ダッシュボード機能:パーツの追加:タイムライン</a><span>2023/08/24 up</span></li>
<li><a href="/manual/dashboard-custom">ダッシュボード機能:パーツの追加:カスタム</a><span>2023/08/24 up</span></li>
<li><a href="/manual/dashboard-customhtml">ダッシュボード機能:パーツの追加:カスタムHTML</a><span>2023/08/24 up</span></li></ul></article>
<ul><li><a href="/manual/style">開発者向け機能:スタイル</a><span>2023/05/18 up</span></li></ul></article></div><input id="SearchTextHidden" type="hidden" value="" />