> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# スペースポータル設計

> YiDAのスペースポータル設計・管理方法を解説します。ポータルの作成・編集手順、各エディションで対応する機能、DingTalkドキュメント／タスク／アプリ／アナウンス連携などの主要コンポーネントを紹介します。

> グレーリリース中

ワークスペースの作成後、本ドキュメントの手順に従ってスペースポータルのホームページを設計します。

## 1. スペースポータル設計

| **機能**                 | **Freeプラン** | **ベーシック版** | **プロフェッショナル版** | **専用版** | **専用版 - OA拡張パック** |
| ---------------------- | ----------- | ---------- | -------------- | ------- | ----------------- |
| **複数ポータル**             | 非対応         | 非対応        | 非対応            | 非対応     | 対応                |
| **モバイルナビゲーションのカスタマイズ** | 非対応         | 非対応        | 非対応            | 非対応     | 対応                |

### 1.1 概要

スペースポータル設計では、業務ニーズに合わせてスペースポータルをカスタマイズできます。1つのスペースにオフィスポータル、社内情報ポータル、党建設ポータルなど複数のポータルを配置し、さまざまな業務シナリオに対応可能です。スペースナビゲーションはカスタム設定に対応しており、各ポータルのテーマはスペーステーマを継承するか、独自のテーマを設定するかを選択できます。

## 2. 手順

### 2.1 ポータルを作成

<Steps>
  <Step title="手順1">
    アプリ管理者として[YiDAワークベンチ](https://www.yidaapps.com/workPlatform)にログインします。
  </Step>

  <Step title="手順2">
    右上の**プラットフォーム管理**ボタンをクリックし、プラットフォーム管理ページを開きます。
  </Step>

  <Step title="手順3">
    左側のナビゲーションメニューから**プラットフォーム専用カスタマイズ** > **スペース管理**を選択し、編集したいスペースを選んで**編集**をクリックします。
  </Step>

  <Step title="手順4">
    **スペースポータル設定** > **ポータルを作成**をクリックします。
  </Step>
</Steps>

#### テンプレートからポータルを作成

* ポータル作成ページで、**テンプレートから作成**または**空白ページを作成**を選択します。

* テンプレートポータルを選択し、ページ上でスペースポータルのレイアウトを設計します。

<Note>
  ワークスペースポータルのコンポーネントは、基本的にブロードキャスト可能なポータルコンポーネントと同じです。詳細は[ポータルコンポーネント](/ja/yida/portal/qqtor4i974oshuet)を参照してください。
</Note>

* 編集後、右上の**保存**をクリックします。

#### 空白のポータルを作成

* **空白ページを作成**をクリックすると、以下のように新しい空白のポータル編集ページへ直接遷移します。

### 2.2 ポータルを編集

1. スペースエディタを開き、**スペースポータル設定**を選択します。対象のスペースポータルを選び、**編集**をクリックします。

### 2.3 ポータル管理

1. スペースポータル設定ページで、複数のポータルを管理できます。リストにはポータル、表示スコープ、最後更新時間と実行ユーザー、ポータルの状態、操作が表示されます。
2. ポータル名をクリックすると、そのビューページが開きます。
3. **編集**をクリックすると、ポータル編集ページが開きます。
4. **コピー**をクリックすると、ポータルを複製できます。
5. **削除**をクリックし、二次確認後にポータルを削除します。
6. **権限設定**をクリックすると、権限設定ページが開きます。

## 3. ポータルコンポーネントリファレンス

<Note>
  ワークスペースポータルのコンポーネントは、基本的にブロードキャスト可能なポータルコンポーネントと同じです。詳細は[ポータルコンポーネント](/ja/yida/portal/qqtor4i974oshuet)を参照してください。相違点は以下で説明します。
</Note>

| **機能／エディション**        | **Freeプラン** | **ベーシック版** | **プロフェッショナル版** | **専用版** | **専用版 - OA拡張パック** |
| -------------------- | ----------- | ---------- | -------------- | ------- | ----------------- |
| **タブ**               | 非対応         | 非対応        | 非対応            | 非対応     | 対応                |
| **DingTalkアナウンス**    | 非対応         | 非対応        | 非対応            | 非対応     | 対応                |
| **DingTalkアプリ**      | 非対応         | 非対応        | 非対応            | 非対応     | 対応                |
| **DingTalkタスク**      | 非対応         | 非対応        | 非対応            | 非対応     | 対応                |
| **DingTalkドキュメント**   | 非対応         | 非対応        | 非対応            | 非対応     | 対応                |
| **DingTalk Project** | 非対応         | 非対応        | 非対応            | 非対応     | 対応                |

### 3.1 スペースポータルがタブコンポーネントに対応

スペースポータルはタブコンポーネントに対応しており、ユーザーはモジュール間をすばやく切り替えられます。

コンポーネントをページにドラッグし、基本プロパティを設定します。

<table>
  <tr>
    <td>**プレビュー**</td>
    <td>**プロパティ**</td>
    <td>**説明**</td>
  </tr>

  <tr>
    <td rowSpan={12} />

    <td>サイズ</td>
    <td>小または中。デフォルト：中。</td>
  </tr>

  <tr>
    <td>あふれ時の挙動</td>
    <td>スクロールまたはドロップダウンの2種類の表示モード。</td>
  </tr>

  <tr>
    <td>コンテンツ</td>
    <td>タブ項目。最大20個まで。</td>
  </tr>

  <tr>
    <td>パディング</td>
    <td>パディングを設定可能。</td>
  </tr>

  <tr>
    <td>枠線</td>
    <td>枠線を設定可能。</td>
  </tr>

  <tr>
    <td>シャドウ</td>
    <td>シャドウを設定可能。</td>
  </tr>

  <tr>
    <td rowSpan={6}>表示デバイス</td>
    <td rowSpan={6}>両プラットフォームまたはPCのみを選択。</td>
  </tr>

  <tr />

  <tr />

  <tr />

  <tr />

  <tr />
</table>

### 3.2 スペースポータルがDingTalkドキュメントコンポーネントに対応

DingTalkドキュメントをYiDAスペースポータルに統合すると、社内のドキュメント管理を一元化できます。プロジェクトやプロセスに関連するすべてのドキュメントを1つのプラットフォームで管理・閲覧でき、プラットフォーム間の切り替えコストを削減できます。

#### 1) スペースポータル×DingTalkドキュメントコンポーネントのインストール

1. YiDAプラグインセンターに移動します。
2. **スペースポータル×DingTalkドキュメント**プラグインを選択します。

<Steps>
  <Step title="右側のプラグインインストールをクリック" />

  <Step title="インストール後、DingTalkワークベンチ > プラットフォーム管理ページでプラグインを管理">
    <Note>
      詳細はプラグイン管理を参照してください。
    </Note>
  </Step>
</Steps>

#### 2) スペースポータル×DingTalkドキュメントコンポーネントの使用

<table>
  <tr>
    <td>**プレビュー**</td>
    <td>**プロパティ**</td>
    <td>**説明**</td>
  </tr>

  <tr>
    <td rowSpan={11} />

    <td>タイトル表示</td>
    <td>パンくずリスト間のコネクタを定義します。デフォルト：「/」。</td>
  </tr>

  <tr>
    <td>タイトルテキスト</td>
    <td>最大100文字まで。</td>
  </tr>

  <tr>
    <td>ヘルプヒント</td>
    <td>設定すると、❓アイコンの横に表示されるヘルプテキスト。</td>
  </tr>

  <tr>
    <td>もっと見る</td>
    <td>クリック時に指定URLを開くその他ボタンを表示します。</td>
  </tr>

  <tr>
    <td>ドキュメントを追加</td>
    <td>クリックしてDingTalkドキュメント一覧を開き、ドキュメントを選択します。</td>
  </tr>

  <tr>
    <td rowSpan={6}>表示デバイス</td>
    <td rowSpan={6}>表示デバイス：両プラットフォームまたはPCのみ。</td>
  </tr>

  <tr />

  <tr />

  <tr />

  <tr />

  <tr />
</table>

### 3.3 スペースポータルがDingTalk Projectコンポーネントに対応

DingTalk ProjectをYiDAスペースポータルに統合すると、タスクステータス、マイルストーン、イシュー記録などのプロジェクトデータがYiDAポータルにリアルタイムで同期され、プロジェクトチームは常に最新の情報を把握できます。

<table>
  <tr>
    <td>**プレビュー**</td>
    <td>**プロパティ**</td>
    <td>**説明**</td>
  </tr>

  <tr>
    <td rowSpan={10} />

    <td>固定値ID</td>
    <td>システムにより自動生成されます。</td>
  </tr>

  <tr>
    <td>タイトル表示</td>
    <td>デフォルト：**DingTalk Project**。</td>
  </tr>

  <tr>
    <td>ヘルプヒント</td>
    <td>設定すると、❓アイコンの横に表示されるヘルプテキスト。</td>
  </tr>

  <tr>
    <td>もっと見る</td>
    <td>クリック時に指定URLを開くその他ボタンを表示します。</td>
  </tr>

  <tr>
    <td rowSpan={6}>表示デバイス</td>
    <td rowSpan={6}>表示デバイス：両プラットフォームまたはPCのみ。</td>
  </tr>

  <tr />

  <tr />

  <tr />

  <tr />

  <tr />
</table>

### 3.4 スペースポータルがDingTalkアナウンス連携に対応

ワークスペースポータルのアナウンスコンポーネントの動的データソースは、DingTalkアナウンスに対応しています。YiDAスペースの**ポータル設計**ページで**アナウンス**コンポーネントを選択し、右側の**属性**パネルで**データソース**を動的データソースに設定し、**コンテンツソース**を**DingTalkアナウンス**に設定します。

<table>
  <tr>
    <td>**アナウンスプレビュー**</td>
    <td colSpan={2}>**設定手順**</td>
  </tr>

  <tr>
    <td />

    <td colSpan={2}>1. プロパティパネルで、アナウンスコンテンツ > 動的データを選択します。<br />2. コンテンツソースをDingTalkアナウンスに設定します。<br />3. アナウンスカテゴリを複数選択します。権限のあるカテゴリのみ選択可能です。</td>
  </tr>
</table>

### 3.5 スペースポータルがDingTalkアプリ連携に対応

ワークスペースには、DingTalkワークベンチに公開されているDingTalkアプリ（社内アプリおよびサードパーティ企業アプリ）を追加できます。カルーセル、記事リスト、アナウンス、クイックエントリなどのコンポーネントの静的データソースでDingTalkアプリを選択できます。

**以下のセクションで各コンポーネントを説明します：**

#### 1) カルーセルコンポーネント

その他の基本プロパティについては、[こちらのドキュメント](/ja/yida/portal/xbn4iv7pclumwhep)を参照してください。

<table>
  <tr>
    <td>**カルーセルプレビュー**</td>
    <td colSpan={2}>**設定手順**</td>
  </tr>

  <tr>
    <td />

    <td colSpan={2}>1. プロパティパネルで、カルーセルコンテンツ > 静的データ > 編集を選択します。<br />2. リンクタイプでアプリを選択を選びます。<br />3. アプリを選択をクリックします。<br />4. アプリダイアログには、権限のあるYiDAアプリとDingTalkアプリが表示されます。</td>
  </tr>
</table>

#### 2) 記事リスト

その他の基本プロパティについては、[こちらのドキュメント](/ja/yida/portal/bd77lg07oxxuuhcg)を参照してください。

<table>
  <tr>
    <td>**記事リストプレビュー**</td>
    <td colSpan={2}>**設定手順**</td>
  </tr>

  <tr>
    <td />

    <td colSpan={2}>1. プロパティパネルで、記事コンテンツ > 静的データ > 編集を選択します。<br />2. リンクタイプでアプリを選択を選びます。<br />3. アプリを選択をクリックします。<br />4. アプリダイアログには、権限のあるYiDAアプリとDingTalkアプリが表示されます。</td>
  </tr>
</table>

#### 3) アナウンス

その他の基本プロパティについては、[こちらのドキュメント](/ja/yida/portal/ik3610wn0kc5twhv)を参照してください。

<table>
  <tr>
    <td>**アナウンスプレビュー**</td>
    <td colSpan={2}>**設定手順**</td>
  </tr>

  <tr>
    <td />

    <td colSpan={2}>1. プロパティパネルで、アナウンスコンテンツ > 静的データ > 編集を選択します。<br />2. リンクタイプでアプリを選択を選びます。<br />3. アプリを選択をクリックします。<br />4. アプリダイアログには、権限のあるYiDAアプリとDingTalkアプリが表示されます。</td>
  </tr>
</table>

#### 4) クイックエントリ

その他の基本プロパティについては、[こちらのドキュメント](/ja/yida/portal/kb5a0gh7oq93ffgl)を参照してください。

<table>
  <tr>
    <td>**クイックエントリプレビュー**</td>
    <td colSpan={2}>**設定手順**</td>
  </tr>

  <tr>
    <td />

    <td colSpan={2}>1. プロパティパネルで、クイックエントリ > 編集を選択します。<br />2. リンクタイプでアプリを選択を選びます。<br />3. アプリを選択をクリックします。<br />4. アプリダイアログには、権限のあるYiDAアプリとDingTalkアプリが表示されます。</td>
  </tr>
</table>

### 3.6 スペースポータルがDingTalkタスク連携に対応

DingTalkタスクをYiDAスペースポータルに統合するには、タスク指標とタスクリストの2つのコンポーネントを利用できます。

**タスクリスト**は、タスクや未処理項目を管理・追跡するためのツールです。タスクチェックリストとして表示され、業務を効率的に整理できます。

**タスク指標**は、タスクリスト内の項目状況を統計・可視化するツールです。タスク全体の進捗をデータで把握でき、目標達成に向けた完了を促します。

#### 1) タスクリスト

<table>
  <tr>
    <td>**プレビュー**</td>
    <td>**プロパティ**</td>
    <td>**説明**</td>
  </tr>

  <tr>
    <td rowSpan={5} />

    <td>**スタイルライブラリ**</td>
    <td>**リストスタイルを切り替えます。**</td>
  </tr>

  <tr>
    <td>**タイトルバー**</td>
    <td>**デフォルトでオン。オフに切り替え可能。**<br />**オンの場合、タイトルテキスト、ヘルプヒント、もっと見るを設定できます。**</td>
  </tr>

  <tr>
    <td>**YiDAタスク**</td>
    <td>**タスクコンテンツをYiDAタスクに設定します。YiDAの作業フロータスクデータのみが含まれます。**<br /><ul><li>**リスト種類：**「未処理タスク」「作成したタスク」「処理済みタスク」「CCタスク」。</li></ul></td>
  </tr>

  <tr>
    <td>**DingTalkタスク**</td>
    <td>**タスクコンテンツをDingTalkタスクに設定します。**<br /><ul><li>**タスクカテゴリ：1つ以上のタスクカテゴリを選択します。**</li></ul><br />タスクカテゴリの選択肢は、組織のDingTalkタスクにあるトップレベルカテゴリと一致します（以下参照）：<br /><ul><li>**リスト種類：**「未処理タスク」「作成したタスク」「処理済みタスク」「参加したタスク」。</li><li>**その他をクリック**：DingTalkタスクセンターを開きます。</li><li>**特定のタスクをクリック**：DingTalkタスクセンターを開き、そのタスクへ移動します。</li></ul></td>
  </tr>

  <tr>
    <td>**表示デバイス**</td>
    <td>**表示デバイス：両プラットフォームまたはPCのみ。**</td>
  </tr>
</table>

#### 2) タスク指標

<table>
  <tr>
    <td>**プレビュー**</td>
    <td>**プロパティ**</td>
    <td>**説明**</td>
  </tr>

  <tr>
    <td rowSpan={5} />

    <td>**スタイルライブラリ**</td>
    <td>デフォルトは青。必要に応じて他のスタイルに切り替え可能。</td>
  </tr>

  <tr>
    <td>**タイトル表示**</td>
    <td>デフォルトでオン。オフに切り替え可能。<br />オンの場合、タイトルテキスト、ヘルプヒント、もっと見るを設定できます。</td>
  </tr>

  <tr>
    <td>**YiDAタスク**</td>
    <td>**タスクコンテンツ**をYiDAタスクに設定します。統計にはYiDAの作業フロータスクデータのみが含まれます。<br /><ul><li>**リスト種類：**「未処理タスク」「作成したタスク」「処理済みタスク」「CCタスク」。</li></ul></td>
  </tr>

  <tr>
    <td>**DingTalkタスク**</td>
    <td>**タスクコンテンツ**をDingTalkタスクに設定します。<br /><ul><li>**タスクカテゴリ：1つ以上のタスクカテゴリを選択します。**</li><li>**タスク指標**：指標は「未処理タスク」「作成したタスク」「処理済みタスク」「参加したタスク」になります。</li><li>**指標をクリック**：DingTalkタスクセンターを開きます。</li></ul><br /><ul /></td>
  </tr>

  <tr>
    <td>**表示デバイス**</td>
    <td>**表示デバイス：両プラットフォームまたはPCのみ。**</td>
  </tr>
</table>