如何創建 ACF 前端表單 [無代碼！]

已發表: 2022-12-14

希望在您的 WordPress 網站上使用高級自定義表單但不知道如何編碼？本指南將幫助您立即創建 ACF 前端表單！

大概閱讀時間： 6分鐘

高級自定義字段 (ACF) 是一個強大的工具。

能夠自定義您的字段並完全按照您的需要構建表單，您的可能性幾乎是無限的。

但是有一個問題。您必須知道如何編碼才能在您網站的前端獲取 ACF 表格。

Formidable Forms 是最好的 WordPress 表單生成器插件。免費獲取！

或者你呢？

這篇文章將向您展示如何在 WordPress 中輕鬆創建 ACF 前端表單，無需代碼！這一切都是使用完美的 ACF 表單生成器Formidable Forms完成的。

讓我們開始吧。

使用高級自定義字段前端表單有什麼問題？

實際上，使用 ACF 創建您的高級自定義字段前端表單並沒有錯！

ACF 是一個強大的工具；如果您知道如何使用 PHP 進行編碼，則可以快速創建獨特的表單。

但是，如果您不知道如何編碼，您就會對眼前的外語摸不著頭腦。

只需查看下面的 ACF 表單示例代碼：

所以，你有兩個選擇：

學習使用 ACF 編寫代碼和創建前端表單
讓 Formidable Forms 為您完成所有艱苦的工作

雖然我們在 Formidable 擁有一支由優秀開發人員組成的團隊，但我們認為您沒有。

因此，我們今天將重點關注高級自定義字段前端表單教程的選項 #2。

如何使用 Formidable 顯示 ACF 前端表單

要開始，您需要一些東西：

強大的形式商業計劃書
ACF 插件（免費或專業版）

立即獲取 Formidable Forms！

要在 ACF 前端使用一些更高級的字段，需要專業版。但是，對於基本字段，您可以使用免費版本。

如果您想了解更多信息，請務必查看我們的 ACF 知識庫文檔！

因此，一旦安裝並激活了 Formidable Forms，請轉到Formidable → Add-ons並單擊ACF Form WordPress 插件的安裝按鈕。

然後，只需幾個簡單的步驟：

創建 ACF 表單域
在 Formidable 中創建您的 ACF 前端表單
映射您的字段

讓我們開始吧。

第 1 步：創建 ACF 表單域

對於我們的示例，我們有一個名為Here Birdie Birdie的觀鳥博客。

我們希望為用戶提供一種方式，讓他們的觀鳥提交能夠自動顯示為博客上的自定義帖子類型。

所以，我們要創建幾個字段供用戶輸入信息：

姓名
日期
時間
鳥鋸清單
附加評論

因此，我們要做的第一件事是進入 ACF 自定義字段。幸運的是，Formidable 支持 19 種不同的 ACF 字段類型的映射。所以，你有很多選擇。

為此，請轉至自定義字段 → 字段組，然後單擊新增。

接下來，您可以通過單擊“添加字段”按鈕來添加您的字段。

因此，我們將創建上面列出的字段並自定義它們以滿足我們的需要。

我們將使用 ACF Repeater字段讓訪問者更容易地顯示他們看到的所有鳥類。轉發器字段允許用戶添加或刪除任意數量的條目。

我們將在這些字段中使用下拉（ACF 中的選擇）字段，以便訪問者可以從鳥類列表中進行選擇。我們還將添加一個數字字段來輸入他們看到每隻鳥的時間。

您可以根據自己的需要隨意定制。但是，要獲得更多高級功能（如中繼器，您必須購買 ACF Pro）。

完成後，點擊保存更改。

第 2 步：在 Formidable 中創建 ACF 前端表單

現在，我們將創建將顯示在您網站前端的表單。

因此，轉到 WordPress 管理面板中的Formidable → Forms 。

接下來，單擊頁面頂部的新增，然後選擇從空白表單或 Formidable 的模板之一開始。

請隨意選擇最適合您情況的選項。我們將從空白表單開始，根據自己的喜好對其進行自定義。

接下來，為您的表單命名，然後單擊Create 。

該插件會將您帶到 Formidable 的拖放式表單構建器，您可以在其中添加任何表單元素。姓名、電子郵箱、電話號碼、地址——隨便你說，都在這裡。

由於我們已經在 ACF 中創建了表單字段，因此我們只需添加匹配的字段以便輕鬆連接它們。

我們在頂部添加了一個字段，因此用戶可以為他們的博客帖子命名，使它們獨一無二！

完成創建表單後，單擊更新以保存更改。

沒有什麼比因為你沒有保存而失去你創造的一切更讓你想起 90 年代的了。

第 3 步：映射您的字段

現在我們已經創建了表單，我們需要啟用 ACF 字段映射。

因此，單擊頁面頂部的設置選項卡，然後轉到操作和通知。

接下來，選擇創建帖子操作以自定義表單字段的顯示方式。

在Create Post form 操作中，向下滾動到 Custom Fields 部分並單擊Map form fields to Advanced Custom Fields開關。

從下拉列表中選擇您的 ACF 字段組，然後通過單擊添加開始將您的自定義字段映射到 Formidable 字段。

此外，如果您使用轉發器字段，則必須正確匹配轉發器和子字段。

映射字段後，單擊更新以保存更改。

就是這樣！用戶現在可以將他們的條目提交到您的 WordPress ACF 前端表單，您的 ACF 和 Formidable Forms 字段將映射並發送信息。

在這裡，您可以使用 View 或使用支持 ACF 的主題在前端顯示信息，然後編輯帖子、帖子標題、內容等等！

這個 ACF 前端表單插件還能做什麼？

Formidable 看起來像是 ACF 的簡單表單生成器，但它遠不止於此。

憑藉數十個 ACF 表單函數、模板文件以及與所有頂級主題（包括 Elementor）的兼容性，Formidable 做到了這一切。

它還有很多額外的功能和選項來增強您的表單：

多步驟表格、測驗和對話表格
多種垃圾郵件防護選項
內置視覺表單樣式器
100 多個表單模板
壯麗景色

這些只是您獲得的部分功能。如果我們自己這麼說，他們會很棒。

那麼，在前端放置 ACF 表單是多麼容易，而且您獲得瞭如此豐富的功能，您還在等什麼？

今天，Formidable 已準備好讓您的網站更上一層樓。

準備好製作您的 ACF 正面表格了嗎？

如果您想知道“如何向前端添加 ACF 字段？” 你現在已經得到了答案。

借助 Formidable 簡單的無代碼解決方案，您可以在幾分鐘內啟動並運行。這篇文章向您展示了具體操作方法。

無論您使用 WordPress ACF 專業版還是免費版，Formidable 都是完美的合作夥伴插件。

因此，如果您準備好開始，請立即獲取 Formidable Forms 並將其放在您的網站上。

立即獲取 ACF 前端表格！

在 Facebook、Twitter 和 YouTube 上關注我們，了解更多令人難以置信的 WordPress 提示和技巧。