> ## 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. # カスタムページデザイナーの概要 > 本ドキュメントでは、カスタムページデザイナーの機能について、上部操作バー、左側ツールバー、中央キャンバス、右側プロパティ設定パネルの使用方法を含めて詳しく紹介します。さらに、データループ反復やページネーション表示の実現方法など、よくある質問への回答も提供します。 | **機能** | **Freeプラン** | **ベーシック版** | **プロフェッショナル版** | **専用版** | | ------- | ----------- | ---------- | -------------- | ------- | | カスタムページ | 非対応 | 非対応 | 対応 | 対応 | ## 1. ユースケース アプリ全体のデータを表示する必要がある場合、たとえば処理待ちの項目、作成した項目、CCされた項目などを表示する際に、カスタムページを使用します。フォーム送信用のクイックエントリボタンを設定することも可能です。 ## 2. 概要 カスタムページデザイナーは、上部ツールバー、左サイドバー、中央キャンバス、右プロパティ設定パネルの4つの部分で構成されています。 以下のセクションで各部分の機能を説明します。 ### 2.1 上部ツールバー #### 2.1.1 ページ設定 詳細は [**ページ設定**](/ja/yida/custom-page/pkfvyw) を参照してください。 #### 2.1.2 ショートカットキー YiDAデザイナーには、以下のようなキーボードショートカットが用意されています。 #### 2.1.3 会議履歴 YiDAデザイナーでは、デザイナー内で会議履歴を確認できます。保存するたびに自動で記録され、最大50件まで保持されます。直近50件の保存記録を確認し、任意の記録にロールバックしたり、変更内容を検査したりできます。 ### 2.2 左サイドバー #### 2.2.1 アウトラインツリー アウトラインツリーを使用すると、ページのレイアウトをより明確に把握できます。また、コンポーネントを一括ドラッグまたは一括削除することもできます。 * アウトラインツリー内のノードをダブルクリックして名前を変更できます。同じタイプの複数のコンポーネントを区別するのに便利です。 * 右上のピン留めアイコンをクリックすると、アウトラインツリーパネルを左側にピン留めできます。 * CMD / CTRL キーを押しながら、アウトラインツリー内のノードを複数選択できます。 以下の動画で設定方法をご確認ください。 #### 2.2.2 コンポーネントライブラリ コンポーネントライブラリからコンポーネントをキャンバス上、またはアウトラインツリー内の目的の位置にドラッグします。 以下の動画で設定方法をご確認ください。 #### 2.2.3 ブロックテンプレート ブロックテンプレートは、デザイン効率を向上させるために用意されています。テンプレートやブロックを適切に活用することで、日常的なページデザインを迅速化し、優れたデザインパターンを徹底できます。詳細は [**ブロックテンプレート**](/ja/yida/custom-page/eab1wa) を参照してください。 #### 2.2.4 データソース データソースはローカル変数またはリモート変数を宣言するもので、データを動的に表示するために使用できます。 プロパティ設定パネルで、コンポーネントのプロパティをデータソースにバインドできます。詳細は [**データソースパネル**](/ja/yida/form/og76m2) を参照してください。 #### 2.2.5 アクションパネル アクションパネルを使用して [JavaScript](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript) コードを記述し、よりカスタマイズされた要件に対応できます。 詳細は [アクションパネル](/ja/yida/developer-features/ocmxyv) を参照してください。 #### 2.2.6 国際化パネル 国際化パネルを使用して多言語コピーを管理できます。プロパティ設定パネルで、コンポーネントのプロパティを多言語データにバインドできます。 詳細は [国際化パネル](/ja/yida/i18n/lhsepqfou1ll0g2g) を参照してください。 ### 2.3 中央キャンバス キャンバスは、コンポーネントを配置・設定してページを構築する場所です。カーソルのヒントに従ってキャンバス上でコンポーネントをドラッグし、ページをレイアウトしたり、必要に応じてコンポーネントをコピーまたは削除したりできます。詳細は以下の動画をご覧ください。 ### 2.4 右プロパティ設定パネル #### 2.4.1 属性設定 属性設定パネルは、コンポーネントの共通プロパティを設定するために使用します。変更内容はキャンバス上でリアルタイムに反映されます。ただし、アクションバインディングや変数バインディングの結果は、プレビュー環境で検証する必要があります。 #### 2.4.2 スタイル設定パネル YiDAデザイナーでは、画像とテキストの表示コンポーネントなど、一部のコンポーネントに対してスタイル設定を提供しています。その他のスタイルオプションについては、[**スタイル設定**](/ja/yida/form/gdnsgw) を参照してください。 #### 2.4.3 プレミアム プレミアムセクションは、コンポーネントのカスタマイズ要件を設定するために使用します。 備考: * **レンダリング条件** については、条件付きレンダリングの説明を参照してください。 * **ループ** については、ループレンダリングの説明を参照してください。 * **レンダリング固定値キー** については、レンダリング固定値キーの説明を参照してください。 ## 3. FAQ 明細コンポーネントは現在、ページ分割表示に対応していません。 代替方法として、コンテナコンポーネント > プレミアム > ループレンダリングと、カスタムページ上のページネーションコンポーネントを組み合わせて、データのループ表示とページ分割を実現できます。 作業フローフォームと通常フォームを除き、その他のページは最大100個の権限グループに対応しています。作業フローフォームと通常フォームは、それぞれ最大100個の送信権限グループと100個の閲覧権限グループに対応しています。