CONTACT FORM 7+ FLAMINGO工具打造完美外貿表單提交功能

2021-01-09 ParkZone

一個好的表單提交功能,或者說是郵件詢單功能,可以提升你的網站詢單率,同時也會提高用戶黏性。

什麼?你的網站沒有表單提交功能?

沒關係,這篇文章會教你外貿小白怎麼在自己的網站中加入表單提交功能。

這裡我們會藉助Contact 7插件、以及Flamingo插件,進行表單功能的實現 (繼續閱讀!) 我們會先從簡單的工具安裝開始講起。

如何安裝Contact 7 插件

Contact Form 7

上圖是Contact Form7的插件安裝界面,

wordpress後臺 > 插件 > 安裝插件 > 搜索「 Contact Form7 」

找到上圖所示的圖標點擊安裝,並且啟用即可。

Contact Form 7 這裡主要是用來實現提交表單功能的,繼續閱讀,稍後我會詳細講解用法。

如何安裝 Flamingo插件

Flamingo插件

Flamingo的插件安裝方式和Contact Form7一模一樣,依葫蘆畫瓢就可以。Flamingo這插件主要目的適用於接收用戶表單提交的信息。

因為,有很多企業網站並沒有配置郵件服務,所以有些是無法接收到用戶提交的表單信息的。所以這裡我們會輔助使用flamingo插件獲取表單消息。

當然,即便你準備郵件功能,我依然建議添加Flamingo插件。不怕一萬,就怕萬一,重要的信息遺漏,那就不好了,對不對?

如何設置表單語言

Contact Form7自然可以自由的切換語言。當你安裝完成Contact Form7之後,會在wordpress網站後臺(wp-admin界面)左側側邊欄中出現一個「聯繫(contact)」的選項。

點擊進入聯繫頁面,就出現如下的圖片,並且已經提供好了一個表單的模板。

Contact Form7 表單管理頁面

點擊「聯繫表單1」 模板會出現如下內容界面:

表單模板界面

你只需要把中文提示部分的內容,更換成自己需要的語言即可。同時這個插件還提供了各種表單功能,你可以根據自己的需求進行添加。

小提示:一個網站可以添加多個表單模板,用於不同的轉化場景。比如文章底部,側邊欄,頂部右上角等等。可以頂多套表單模板,用於滿足當前網站的用戶需求。

如何在網站側邊欄設置表單提交功能

進入wordpress後臺 > 聯繫界面,獲取定製好語言的表單模板簡碼。如下圖所示,把代碼Ctrl+C複製出來。

簡碼部分

然後,進入

wordpress後臺 > 外觀 > 小工具中

將左側欄目中的文本功能,點擊拖動到右側對應的側邊欄中。如下圖所示。

點擊拖動文本功能

拖動到固定位置後,點開小工具區域的文本編輯框,點擊文本(html代碼),並且把剛才的簡碼複製到文本框當中。

將代碼複製到文本框,並起一個標題

小提示:最好給自己的文本編輯框起一個吸引眼球的題目。像上圖所示那樣。

點擊保存,同時反回到首頁。F5刷新頁面之後,你就能看到自己定製的表單顯示到了側邊欄中。當你設置完成之後,你的側邊欄應該和我下方圖片這裡一樣。

設置好之後的側邊欄

如何在頁面內部設置表單提交功能

上方我講的是側邊欄,同樣在文章或者頁面當中,方法如出一轍。

文章編輯界面,都有文本功能,你只需要把表單的簡碼,添加到自己指定的位置即可,非常的方便哦!這裡我就不再進行演示。

表單功能測試

這裡你就需要用到Flamingo設置了,如果你沒有安裝,那麼當你測試表單提交的時候,你多半是收不到詢單的Email的。

如果你安裝好了Flamingo,那麼當你測試的之後,就會在如下:

wordpress後臺 > Flamingo > 收件箱信息

界面中看到測試的信息。如下圖這樣,大功告成~

收件箱信息界面

如果你設置過郵件,郵件回復模板應該如何設置呢?

非常的簡單,再次回到 後臺聯繫界面,在模板編輯中有個郵件板塊的設置。你可以根據自己的喜好去配置自己的郵件回復模板。

郵件模板板塊界面

同時,我也建議大家,把郵件模板右邊的留言板塊,同步設置一下,這樣用戶體驗會更好。

怎麼設置郵箱獲取用戶詢單呢?

在後臺 設置(setting)當中有個郵件伺服器設置哦,記得讓你們的技術設置好郵件伺服器(需要特殊伺服器配置的)並把對應內容填好保存即可。

郵件模板板塊界面

趕緊回去試試吧?

相關焦點

  • 如何在WordPress中製作聯繫表單(3種方法)
    ,這個功能能夠阻止大部分的廣告郵件不少廣告郵件都出自一個工具:,GSA能夠根據產品詞搜索目標企業網站,按既定規則找到聯繫頁面,自動根據自定義的廣告內容提交表單,這也是一種常見的拓客方式(感興趣的也可以試試喲~),GSA還能破解谷歌驗證碼,我也不推薦用谷歌驗證碼,因為它會讓網站速度變慢不少別用複雜的數字計算問題
  • 如何在WordPress中製作聯繫表單(2種方法)
    製作聯繫表單的教程概述方法一、使用Contact Form 7 插件製作聯繫表單,使用Flamingo插件記錄收到的詢盤所有wordpress網站都能使用,不限主題,不限頁面編輯器優點:能夠提供自定義問題驗證功能
  • JavaScript之阻止form表單提交三種方式
    今天和大家分享一下,關於如何阻止form表單的提交。一、為什麼要阻止form表單的提交呢?以及使用場景我們在工作中,比如一個登錄頁面,當填完用戶登錄信息後,需要對用戶信息進行校驗,如果有問題,那麼就不應該將數據提交到後臺,而是在前臺阻止,接下來我們看一下,如何阻止form表單的幾種方式1、表單第一種阻止方式:form結合onclick事件來阻止form表單的提交<head><meta charset="UTF-8"
  • 這個表單工具可不簡單,formtalk引領「雲表單」新時代
    邁入 2016 年以來,PAAS市場在國內發展得異常火爆,表單工具也開始擁抱雲計算,通過利用雲計算和大數據為用戶帶來業務上的新體驗。而現在,有一款僅僅上線了3個月,就已經領先市場諸多同類的產品——formtalk,開始深深吸引了人們的注意力。
  • HTML中表單form的相關知識
    這個屬性的默認值為:application/x-www-form-urlencoded如果要上傳文件,則應該設置為:multipart/form-dataform 表單中的<label> 標記:每一個表單元素的文字描述都應該使用<label> 標記!
  • html中form表單標籤的詳細介紹
    本篇將介紹的是html中form表單標籤的用法,有興趣的朋友可以學習一下!在html中,表單是經常用到的,用來與用戶交互並提交數據。今天要介紹的就是表單標籤form標籤,接下來我們就一起來看看它的用法吧!「form」作為英文單詞有「表格」的意思,那它在html中作為標籤又充當什麼樣的角色呢!
  • 前端入門須知:輕鬆學會form表單製作!
    >HTML新增屬性學習目標一、Form表單表單在 Web 網頁中用來給訪問者填寫信息,從而能採集客戶端信息,使網頁具有交互的功能。表單是由窗體和控制項組成的,一個表單一般應該包含用戶填寫信息的輸入框,提交按鈕等,這些輸入框,按鈕叫做控制項,表單很像容器,它能夠容納各種各樣的控制項。
  • Django Form基於Model定義表單
    使用ModeForm定義表單將表單應用到視圖函數中才是有意義的,下面我們就實現用戶添加的功能通過 ModelForm 來實現,首先在 index 目錄下創建模板文件 useradd_model_form.html 文件,編寫代碼如下所示:<!
  • 如何在vue項目中使用muse-ui並創建一個form表單提交
    npm run dev5、打開HBuilderX開發工具,導入項目kmn打開HBuilderX開發工具,導入項目kmn6、再次使用npm命令安裝muse-ui,命令為:npm i muse-ui -Snpm i muse-ui -S7、在安裝muse-ui之前,需要停掉項目,然後再次運行項目
  • python接口自動化15-multipart/form-data表單提交
    前言multipart/form-data這種格式官方文檔給的參考案例比較簡單,實際情況中遇到會比較複雜,本篇講解multipart
  • Django Form表單完整使用流程
    ,我們可以嘗試使用表單系統來實現這個功能了,在本節我們將匯總相關知識點,以此來講解如何使用 Form 表單系統完成實際功能的開發。表單系統重點知識回顧表單系統的核心是 Form 對象,它將表單中的欄位封裝成了一系列的 Field 和驗證規則,以此來自動生成 HTML 表達標籤。本節中首先使用 Form 對象實現書籍的搜索功能,然後再詳細講解 Form 對象的構成。那麼下面我們首先對前面學過的知識做一下簡單的重點知識回顧。
  • Shopify工具介紹:Easy Contact Form
    自定義你的表單 添加自定義背景圖片以強調你的品牌。自定義字體也可用。安全和私密的溝通。 可嵌入或獨立 在Shopify的網站上輕鬆嵌入Shopify的聯繫表格,無需開發人員幫助。有用,清晰,簡單的說明或使用Shopify的標準聯繫表格選項卡 關於Easy Contact Form 使用Shopify的響應式和可嵌入的聯繫表單升級你的客戶支持。你的客戶可以在你的網站上快速輕鬆地與你聯繫。添加欄位並將其標記為可選或必需。高級版包括自定義背景圖像。
  • 曬碼姐講堂——創建Form表單實例
    任何一個伺服器腳本語言最常見的應用場景就是處理html表單,我們通過創建一個書店圖書的錄入實例開始學習PHP.首先,我們先看form表單:form表單都是成對出現的。<form ></form> 我們都是把需要提交的數據信息寫到這個表單裡面,提交才可以,如果寫到外面,是獲取不到信息的。
  • 表單FORM與GET方法的區別
    表單提交中Get和Post方式的區別有5點1. get是從伺服器上獲取數據,post是向伺服器傳送數據。2. get是把參數數據隊列加到提交表單的ACTION屬性所指的URL中,值和表單內各個欄位一一對應,在URL中可以看到。
  • HTML+CSS:使用form表單控制項,與用戶交互
    今天這篇文章我們主要來看一下表單的控制項都有哪些,如何使用表單標籤,與用戶交互。(1)網站怎樣與用戶進行交互?答案是使用HTML表單(form)。表單是可以把瀏覽者輸入的數據傳送到伺服器端,這樣伺服器端程序就可以處理表單傳過來的數據。
  • Django Form表單API詳解
    對上述功能進行詳細的講解,通過本節知識的學習,你會對 Django 表單系統有更加深入的認識,在本節中我們會穿插介紹一些小的應用實例以便於讀者更好的理解這些 API 。Form表單驗證數據方法1) Form.clean()前面介紹過對於單個 Field 欄位有 clean() 方法,它起到得到「清潔的數據」的作用,而這裡的 clean() 是對於整個 HTML 表單來講的,這一點需要大家注意。通常該方法用於自定義驗證功能。如果想實現自定義驗證機制,那麼你需要重寫這個 clean 方法。
  • PHP之表單的提交
    一、前臺數據的提交前臺數據的提交一般在form表單中完成,主要有兩種方式,一種為post,一種為get。phpecho "提交成功";提交結果:說明:(1)、密文提交方式,提交在http協議內部。3、模擬get方式提交數據主要應用在沒有表單的情況下,向後臺提交數據。
  • 使用React和HTML5表單驗證API處理表單
    在本教程中,我們將看看如何使用React和HTML5的現代組合來處理表單提交和驗證。當我們在Web應用程式中討論用戶輸入時,我們經常首先想到HTML表單。Web表單從HTML的第一個版本開始就已經可用。顯然,該功能已於1991年推出,並在1995年以RFC 1866標準進行了標準化。
  • layui的彈出框、form表單、表格使用常見問題解決方案
    主要包含:1、點擊按鈕,將父頁面數據傳遞到子頁面的問題2、關閉子頁面刷新父頁面問題3、動態地為form表單中的select添加option不顯示問題4、form表單提交獲取表單數據問題5、表格的初始化請求分頁參數
  • [爬蟲篇]如何破解表單提交參數(FormDate)的網站
    這時打開F12檢查頁面元素,發現此處有一參數,位於FormDate下:此時需要模擬表單提交的方式來請求頁面,具體代碼無法在這裡分享給大家,如果有需要的同學可以留言。其中表單提交參數的方式一般都是post,因此使用NameValuePair,這裡通過Jsoup解析後返回出前三頁公司的名字,如下所示:以上就是關於【爬蟲篇】如何破解表單提交參數(FormDate)的網站的介紹了,如果你有問題或者有更好的技術,可以留言,一起交流吧~