このヘルプページはCreator 6のユーザー向けです。旧バージョン（Creator 5）をご利用の場合は、こちらをクリックしてください。ご自身のCreatorバージョンを確認してください。

ウィジェットの機能

ウィジェットを利用することで、次のことが可能になります。

• アプリ特有の機能を作成・カスタマイズする
• アプリケーションと顧客との連携方法を再定義する
• フロントエンドデザインを完全にコントロールできる
• Creatorアプリに対応したサードパーティアプリを組み込む

機能の作成とカスタマイズ

1. ウィジェットファイルのアップロード
   
2. Figmaからのインポート
   

ウィジェットファイルのアップロード

ウィジェットスクリプトやその要素（例：CSSやJSファイル）に直接変更を加えた場合は、必須としてウィジェットが正常に動作するために、更新済みファイルを再度アップロードする必要があります。

1. アップロードしたファイル内でウィジェットの動作をどのようにするか定義してください。例えば、特定の処理をトリガーしたり、特定のデータを表示したい場合などが考えられます。
2. ウィジェットを視覚的に魅力的にし、アプリケーション全体のデザインになじませるため、CSSスタイルを適用してください。
3. さまざまなファイルをアップロードしてウィジェットをテストし、期待通りに動作するかエラーがないか確認してください。

ファイルをアップロードしてウィジェットを作成する方法については、こちらをクリックしてください。

Figmaからのインポート

Figmaのデザインファイルをインポートしてウィジェットを作成する方法については、こちらをクリックしてください。

ユースケース

ケース1：ウィジェットファイルのアップロード

自動車ディーラーであり、月間営業データを管理するアプリケーションダッシュボードをお持ちだと仮定します。このダッシュボードには、販売された交通手段の番号の詳細、先月の営業との比較、販売モデルのランキング、営業チームごとの個人パフォーマンススコア、そして顧客フィードバックフォームが含まれています。フィードバックマトリクスタイプのフォームを表示する必要があります。このフォームをページ上のウィジェットとして設定することができます。JavaScript、CSS、HTMLを使ってこのフォームを作成し、Creatorにアップロードして、必要なページにウィジェットとして追加できます。Creator APIを利用すれば、このレポートからデータを追加、更新、編集、削除することも可能です。

ケース2：FigmaデザインファイルのCreatorへのインポート

Creatorで連絡先管理アプリケーションを作成したと仮定します。このアプリケーションには連絡先詳細フォームがあり、利用者は必須データを入力する必要があります。従来のフォームスタイルでは、要件の具体的な深さや背景まで正確に伝えることが難しい場合があります。しかし、タブを追加したり、ドロップダウンメニューを変更したり、FigmaのUIキットを使ってウィザード形式でフォームを構築し、そのカスタマイズしたデザインをウィジェットとしてCreatorにインポートすることが可能です。これにより、フォームの目的や背景を迅速かつ効果的に伝え、より優れたユーザー体験を実現できます。

アプリインターフェースの再定義

ウィジェットパラメーターの設定

メモ: 
- 上記で言及されている '名前' および '種類' キーは大文字・小文字が区別されます。
- '名前' 変数は 50 文字以内で、大文字アルファベット、小文字アルファベット、数字、アンダースコア、スペースのみ使用できます。
- '名前' と '種類' キーは 頻度 設定に必須です。これらはウィジェットの更新時に 編集 または 削除 しないでください。 - '名前' キーの値は一意である必要があります。 
- Application、Form、レポート 種類はそれぞれ1つだけ存在可能です。 項目 種類は、Form または レポート 種類とともに存在しなければなりません。 
- 設定の合計番号は 20 を超えてはいけません。 

ウィジェットをページに追加 すると、アプリケーションの編集方法で、ウィジェット設定 メニューが右側からスライドインし、マッピング可能な項目が表示されます。これにより、ウィジェットを用途に合わせてカスタマイズできます。

サードパーティアプリの組み込み

注意事項

• JS APIを利用したウィジェットは、公開済みページ上では動作しません。
• widget 郵便番号フォルダーには、初期設定でAppフォルダー内にwidget。htmlファイルが含まれています。これはindexファイル、つまりこのファイルがページのウィジェットとして組み込まれます。
• Appフォルダー内に新たなフォルダーを作成し、widget。htmlファイルを新規フォルダーに移動した場合は、以下の形式でindexファイル名を指定する必要があります：
  / / .html

制限事項

1. Zohoアカウントでは最大50個のウィジェットを作成できます。
2. 内部ホスティングの場合、
1. widget 郵便番号ファイルの最大サイズは10MBまでです。
2. widget 郵便番号ファイル内のファイル数は250個を超えてはいけません。
3. widget 郵便番号ファイル内の単一ファイルの最大サイズは5MBまでです。
3. widget 郵便番号ファイル名は100文字以内で、英数字 (A-Z, a-z, 0-9), _, \, $, ., -が使用できます。
4. widget 郵便番号ファイル内のファイル名は50文字以内で、英数字 (A-Z, a-z, 0-9), _, ., $, -が使用できます。
5. widget 郵便番号ファイル内のフォルダー名には英数字 (A-Z, a-z, 0-9), _, $, -が使用できます。
6. 対応ファイル形式含まれる形式： .txt、.md、.XML、.dre、.jpg、.jpeg、.png、.gif、.css、.js、.HTML、.json、.mp3、.svg、.woff、.ttf、.eot、.otf、.woff2、.webm、.mp4。

関連トピック

• CLIのインストール
• ファイルをアップロードしてwidgetを作成
  
• Figmaからwidgetを作成
• ページにwidgetを追加
• JS APIドキュメント
• サンプルwidget