一、如何使用在線表單組件？

在線表單組件是一個(gè)實(shí)現(xiàn)在頁(yè)面上添加表單功能的模塊，使用此表單可以收集訪客信息，訪客也可以通過(guò)表單對(duì)產(chǎn)品或服務(wù)進(jìn)行詢價(jià)，支持添加新表單，也支持編輯已有表單。

在線表單組件一般應(yīng)用在聯(lián)系我們頁(yè)面、產(chǎn)品列表頁(yè)面、產(chǎn)品詳情頁(yè)面，通過(guò)添加“聯(lián)系我們表單”實(shí)現(xiàn)訪客與商家的互動(dòng)，通過(guò)“產(chǎn)品詢價(jià)表單”實(shí)現(xiàn)訪客對(duì)產(chǎn)品的詢價(jià)。也可以在頁(yè)腳添加一個(gè)快速聯(lián)系表單，方便用戶在任何需要聯(lián)系我們的地方快速發(fā)送信息。

申請(qǐng)表單舉例：

產(chǎn)品詢價(jià)表單舉例：

二、如何使用在線表單組件？

1、如何添加在線表單組件？

第一步：在頁(yè)面上找到添加組件入口。把鼠標(biāo)放到要添加組件的區(qū)域，出現(xiàn)小水滴（即添加組件按鈕），單擊小水滴，彈出“添加組件”彈出框；

第二步：添加“在線表單”組件。

在高級(jí)組件中，找到“在線表單”組件，單擊“在線表單”，彈出“設(shè)置在線表單”窗口；

2、如何設(shè)置在線表單組件？

情況1：接著上面的操作，在彈出的“設(shè)置表單”，可以設(shè)置在線表單組件的內(nèi)容、高級(jí)功能和風(fēng)格。

情況2：在線表單組件已經(jīng)添加好了，如果表單展示形式使用的是“默認(rèn)展示”，可以通過(guò)以下步驟進(jìn)入此組件的設(shè)置項(xiàng)中：把鼠標(biāo)放到在線表單組件所在的區(qū)域，左上角出現(xiàn)組件名稱，把鼠標(biāo)移到“設(shè)置表單”四個(gè)字右側(cè)的第一個(gè)按鈕處即“設(shè)置”，單擊它即可進(jìn)入設(shè)置項(xiàng)中，在彈出的設(shè)置在線表單窗口，可以設(shè)置表單的內(nèi)容、高級(jí)功能，風(fēng)格。

情況3：在線表單組件已經(jīng)添加好了，如果表單展示形式使用的是“右下角彈窗展示”，可以通過(guò)以下步驟進(jìn)入此組件的設(shè)置項(xiàng)中：首先找到“在線表單組件懸浮占位”幾個(gè)字，然后把鼠標(biāo)放到這幾個(gè)字上，左上角出現(xiàn)組件名稱，把鼠標(biāo)移到“在線表單”四個(gè)字右側(cè)的第一個(gè)按鈕處即“設(shè)置”，單擊它即可進(jìn)入設(shè)置項(xiàng)中。

在彈出的設(shè)置在線表單窗口，可以設(shè)置表單的內(nèi)容、高級(jí)，風(fēng)格。

2.1 如何設(shè)置表單內(nèi)容？

選擇表單：?jiǎn)螕粝聢D中“聯(lián)系我們-測(cè)試1”右側(cè)的下拉小箭頭選擇要顯示的表單，若要選擇這個(gè)表單，前提是要先創(chuàng)建這個(gè)表單才可以。

選擇成功跳轉(zhuǎn)頁(yè)：訪客填寫(xiě)表單中要求的信息之后，然后提交信息，提交成功之后跳轉(zhuǎn)的頁(yè)面。如果不設(shè)置的話，默認(rèn)會(huì)跳轉(zhuǎn)到網(wǎng)站首頁(yè)。

基礎(chǔ)設(shè)置

表單名稱：支持編輯表單名稱；

開(kāi)啟驗(yàn)證碼：一般默認(rèn)開(kāi)啟驗(yàn)證碼，目的是防垃圾信息；

您的表單：直接點(diǎn)擊文本編輯框旁邊的名稱即可彈出修改框，可直接向右拖動(dòng)文本框即可刪除文本框；

拖動(dòng)組件到左邊：直接拖動(dòng)其欄目下的編輯框到左邊即可添加到您的表單中完成之后點(diǎn)擊保存；

郵件提醒設(shè)置

是否使用郵件提醒：根據(jù)需要選擇是否使用郵件提醒功能，如果使用了，當(dāng)訪客戶提交了信息之后，會(huì)把這個(gè)信息同步發(fā)送到設(shè)置的郵箱中。支持設(shè)置一個(gè)接收郵箱和一個(gè)抄送郵箱。

是否發(fā)送給負(fù)責(zé)人：針對(duì)產(chǎn)品詢價(jià)，若選擇了發(fā)送給負(fù)責(zé)人，那么網(wǎng)站主賬號(hào)中設(shè)置的郵箱中同時(shí)會(huì)收到一封提醒郵件。

短信提醒設(shè)置

可以開(kāi)啟短信提醒功能，輸入接收號(hào)碼，當(dāng)訪客填寫(xiě)的信息之后，手機(jī)同時(shí)也會(huì)收到短信提醒。短信提醒默認(rèn)免費(fèi)贈(zèng)送200條。超過(guò)這個(gè)數(shù)量之后，若需要繼續(xù)使用，請(qǐng)聯(lián)系您的銷售顧問(wèn)咨詢付費(fèi)情況。

2.2 如何設(shè)置在線表單組件的高級(jí)功能？

是否顯示結(jié)果集：這里通常都會(huì)選擇“否”；

是否為詢價(jià)表單：此表單若為詢價(jià)表單，需選擇 “是”，這樣收到的詢價(jià)信息才會(huì)帶有產(chǎn)品信息，我們才更清楚潛在用戶是針對(duì)哪個(gè)產(chǎn)品進(jìn)行詢價(jià)的，有利于我們更好的回復(fù)用戶。如果此表單不是詢價(jià)表單，請(qǐng)選擇否。

2.3 如何設(shè)置在線表單組件的風(fēng)格？

表單展示形式：可以選擇默認(rèn)展示形式也可以選擇“右下角彈窗展示”形式；

標(biāo)題輸入框排列方式：標(biāo)題與輸入框的排列方式有多種，可以根據(jù)需要選擇，如下圖所示：

表單展示形式選擇“右下角彈窗展示”時(shí)，支持設(shè)置：彈窗是否默認(rèn)收起、以及彈窗樣式。

輸入框樣式：支持選擇不同的輸入框樣式；

輸入框背景色：點(diǎn)擊下拉小箭頭可以選擇輸入框背景色；

輸入框選中背景色：點(diǎn)擊下拉小箭頭可以選擇選中輸入框時(shí)的背景色；

按鈕位置：可以選擇“提交”等按鈕展示的位置；

按鈕樣式：可以選擇默認(rèn)按鈕樣式，也可以自定義按鈕樣式；

按鈕樣式：如果選擇“自定義”按鈕樣式，可以自定義以下內(nèi)容：

按鈕寬度：可以選擇“寬度固定像素”，也可以選擇“寬度固定百分比”；

調(diào)整按鈕高度和寬度：可以手動(dòng)拖動(dòng)寬度或高度后面的按鈕來(lái)調(diào)整按鈕的寬度和高度；

按鈕初始樣式：可以調(diào)整按鈕背景顏色、文字顏色、邊框、實(shí)線、圓角弧度、文字字號(hào)；

鼠標(biāo)懸浮樣式：可以調(diào)整鼠標(biāo)懸浮到按鈕上時(shí)的按鈕背景顏色、文字顏色、邊框、實(shí)線、圓角弧度、文字字號(hào)。

設(shè)置好以上內(nèi)容以后，記得點(diǎn)設(shè)置框右下角的保存哦。

3、如何設(shè)置表單標(biāo)題（表單名稱）的背景顏色？如何設(shè)置表單內(nèi)容區(qū)的背景顏色？

可以通過(guò)組件的編輯樣式入口實(shí)現(xiàn)個(gè)性化的表單樣式，比如將表單的標(biāo)題背景色改為藍(lán)色、內(nèi)容區(qū)背景改為淡灰色，將按鈕改成藍(lán)色，并且還可以調(diào)整表單的輸入框排版方式，如下截圖所示界面操作：

進(jìn)入表單的編輯樣式中：首先找到“在線表單組件懸浮占位”幾個(gè)字，然后把鼠標(biāo)放到這幾個(gè)字上，左上角出現(xiàn)組件名稱，把鼠標(biāo)移到“在線表單”四個(gè)字右側(cè)的第二個(gè)按鈕處即“編輯樣式”，單擊它即可進(jìn)入樣式編輯器中。

修改標(biāo)題欄的背景顏色，如下圖所示：

修改內(nèi)容區(qū)背景顏色：如下圖所示。

友情提醒：如果需要網(wǎng)站上的每個(gè)頁(yè)面都有這個(gè)彈窗表單收集信息，建議把“在線表單”組件添加在網(wǎng)站頁(yè)腳區(qū)域，這樣每個(gè)頁(yè)面都會(huì)有這個(gè)彈窗表單了。

設(shè)置好組件的以上設(shè)置以后，單擊“保存”。另外，可以根據(jù)需要使用此組件的以下功能，以下是所有組件的通用功能：

3、查看如何編輯組件的樣式？

4、查看如何復(fù)制組件？

5、查看如何應(yīng)用組件？

6、查看如何刪除組件？

7、查看如何恢復(fù)組件？

三.組件優(yōu)化

1.在線表單組件在“表單管理”導(dǎo)出數(shù)據(jù)時(shí)可以根據(jù)篩選條件導(dǎo)出，并且能夠附帶產(chǎn)品信息。

（1）新增功能應(yīng)用場(chǎng)景：用戶表單中數(shù)據(jù)量過(guò)多時(shí)，可以使用篩選條件選擇自己想要導(dǎo)出的特定數(shù)據(jù)，同時(shí)，導(dǎo)出的數(shù)據(jù)中還包含產(chǎn)品的相關(guān)數(shù)據(jù)。

（2）操作方法：

2.在線表單組件新增表單字段左對(duì)齊的風(fēng)格；（2017-4-27優(yōu)化）

（1）新增風(fēng)格應(yīng)用場(chǎng)景：新增風(fēng)格可以按照實(shí)際需要自定義左邊標(biāo)題的寬度；

（2）新增風(fēng)格的操作方法：