技術文件目前產品線:Fluent Forms 表單

如何使用 Fluent Forms 建立表單

更新日期
閱讀時間
約 5 分鐘
來源狀態
generated-draft

本篇說明

本教學說明如何在 WordPress 後台使用 Fluent Forms 外掛,從新增空白表單、加入欄位、自訂設定,到儲存並將表單嵌入頁面或文章的完整流程。

適合誰使用

使用 Fluent Forms 外掛的 WordPress 網站管理者,想要從零開始建立表單者

開始前準備

  • 需先登入 WordPress 後台才能進行操作
  • 若要使用進階版付費範本,需安裝並啟用 Fluent Forms Pro Add-on

教學內容

建立新表單

可透過彈出視窗選擇建立空白表單、使用範本、建立對話式表單,或用 AI 建立表單

也可以透過 Import Form 按鈕匯入現成的表單

  1. 登入 WordPress 後台,於左側選單點選 Fluent Forms > Forms
  2. 點擊 Forms 區塊中的 + Add New Form 按鈕

    Add new form
    官方文件介面截圖:Add new form

  3. 在彈出視窗中點擊 Plus Icon 建立空白表單

    New form options
    官方文件介面截圖:New form options

新增欄位

可在編輯頁面使用搜尋列以欄位名稱尋找所需欄位

Form editor
官方文件介面截圖:Form editor

  1. 進入編輯器頁面後,點擊左上角的 Pencil Icon 編輯表單名稱
  2. 在彈出視窗輸入表單標題文字,點擊 Rename 按鈕完成命名

    Rename form
    官方文件介面截圖:Rename form

  3. 點擊 Plus Icon 或點開 Input Fields 分頁下的 Dropdown Arrow 開啟 Fields Sections
  4. 點擊所需的欄位按鈕,或以拖曳方式將欄位放入編輯器中

    Drag drop fields
    官方文件介面截圖:Drag drop fields

自訂表單欄位

欄位自訂功能涵蓋範圍廣泛,例如重新命名欄位或設定檔案上傳欄位的最大檔案大小

  1. 將滑鼠移到想調整的欄位上,點擊 Pencil/Edit Icon
  2. 系統會導向右側邊欄的 Input Customization 分頁進行設定

    Field customization
    官方文件介面截圖:Field customization

表單編輯歷史紀錄

History 分頁可用來還原表單至先前儲存的版本,或刪除不需要的紀錄項目

Form edit history
官方文件介面截圖:Form edit history

  1. 在 Form Builder 中開啟 History 分頁,查看表單的近期變更紀錄

儲存並將表單嵌入前台

點擊 Preview & Design 按鈕可預覽表單完成後的樣式

  1. 完成自訂後,點擊右上角的 Save Form 按鈕儲存所有變更
  2. 從頂端工具列複製表單的 ShortCode

    Save and shortcode
    官方文件介面截圖:Save and shortcode

  3. 將 ShortCode 貼到想要顯示表單的頁面或文章中

    Paste form shortcode
    官方文件介面截圖:Paste form shortcode

    Form preview
    官方文件介面截圖:Form preview

介面名稱對照

  • New Blank Form:從空白狀態開始建立表單的選項
  • Choose a Template:選擇依分類整理的預製表單範本,免去從零開始建立表單的麻煩
  • Conversational Forms:將內容或問卷轉換為互動式對話形式的表單類型
  • Create Using AI:透過 AI 協助建立表單的選項
  • Import Form:用來匯入現成表單的按鈕
  • Input Customization:右側邊欄中用於調整欄位各項細節設定的分頁
  • History:顯示表單近期變更紀錄,可用來還原或刪除紀錄的分頁
  • Save Form:儲存表單所有變更內容的按鈕
  • Preview & Design:用來預覽表單顯示樣式的按鈕
  • ShortCode:用於將表單嵌入頁面或文章前台顯示的短代碼

注意事項

注意

若想使用進階版預先設計的表單範本,必須先安裝並啟用 Fluent Forms Pro Add-on,否則無法使用

官方來源

還是卡住了?

先把問題問清楚,通常比直接開工單更快。複製下面的結構,補上你的情況後送出。

用 AI 先釐清問題

/ai 我正在閱讀「如何使用 Fluent Forms 建立表單」,目前卡在:

我已嘗試:

我看到的畫面/錯誤訊息:

請用一步一步的方式告訴我下一步。

需要我們實際進入網站調整設定、修改佈景主題或處理資料時,再建立 /task 工單。