# 建立 HTML 面板外掛程式

![](/files/y67k8HBxVwBRrE1siJXn)

顯示 HTML 頁面的面板式外掛程式有一個結構如下的 *manifest.json* 檔案：

```
{
    "PluginName": "Hello Block!",
    "PluginType": "Panel",
    "PluginDescription": "Creates a panel with an HTML form that allows dimensional input for a 3D block which will get generated at the world origin.",
    "Scripts": [
        "PLUGINLOCATION/block.js"
    ],
    "Panel": "PLUGINLOCATION/hello_block.html",
    "PanelIcon": "PLUGINLOCATION/hello_block.png"
}               
```

除了[標準的 JSON 性質](/zh-tw/plugins/how-to-develop-plugins/advanced-development/general-plugin-setup-in-the-manifest.md)，面板式外掛程式還包括以下特殊的 JSON 性質：

* 「Panel」告訴 FormIt 此外掛程式是一個面板，並連結至應載入面板中的 HTML 檔案位置。
* HTML 檔案的標頭中需要指向相應 JavaScript 檔案的連結，以及用於設定樣式的 CSS 檔案。
* HTML 檔案將在 FormIt 面板中呈現，如同在瀏覽器中一樣。
* 您可以在 [FormIt3D 組織](https://github.com/FormIt3D/)中查看 Rich HTML 介面的範例。
* 「PanelIcon」定義此外掛程式顯示在應用程式右側頁籤中的圖示。如果未定義，FormIt 會使用外掛程式名稱的首字母建立自動圖示。

設定 HTML、CSS 和 JavaScript 檔案後，您可以透過[載入或安裝](https://windows.help.formit.autodesk.com/zh-tw/plugins/how-to-develop-plugins/additional-development-options/pages/38SePUTZAA8xUmVUmUsJ#load-vs.-install)來開始測試 HTML 面板外掛程式。


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://windows.help.formit.autodesk.com/zh-tw/plugins/how-to-develop-plugins/additional-development-options/creating-an-html-panel-plugin.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
