Introduction:


Notice: This feature will be available starting March 2nd, 2014

In order to protect your account from bots that may attempt to automatically initiate a call, LivePerson has added a CAPTCHA test feature to the Voice service.
As part of this change, the CAPTCHA test is displayed to the visitors who clicked the Call Button, at the bottom of the Pre-Call / Offline Surveys.

 captch

Note:
  • The CAPTCHA test is only available for the Static and the Smart Call Buttons.

  • For accounts in which the voice resources were not customized, the CAPTCHA test is enabled automatically. However, if the voice resources were customized, a code within these resources needs to be edited.
  

Instructions:


To enable the CAPTCHA test in your account:

Step 1: Check whether your voice resources are customized:

  1. From the Admin Console click Visitor Experience > Voice > Resources (tab).
  2. Expand the Voice Windows list by clicking the + icon.

    check_customized_resourses

  3. Search for the pre_call.html and the pre_offline.html resources and check their values in the Updated By column.

    131024095807755cucustomized resourses check123

  • If the value in the Updated By column is System for both of the resources, the resources are not customized. In this case no further action is required. The CAPCHA test is automatically enabled in your account.

  • If the value in the Updated By column is different than System for one of these resources, it implies that this resource is customized. In this case, edit this resource according to the instructions below. If both of the resources are customized, edit both of them.

    131024095807755cucustomized resourses chech field updated by


Step 2: Edit the customized resources

For the pre_call.html customized resource:

  1. Click the 131024095807755edit button button in the pre_call.html line, to enter the edit mode.

  2. Add the following code at the beginning of the HTML code:

     #set ($voiceCaptchaLine="$!{vsm.VOICE_CAPTCHA_LINE}")  
    For example:
    add line pre-chat


  3. Add the following code within the head section, right before the colosing of the script tag :

    var captchaId = "${captchaId}";
    For example:
    131024095807755add var code


  4.  Add the following code at the bottom of the centerContent table:



    #foreach ($question in $survey.questions)
    #set ($seq = $question.sequence - 1)
    #parse("SYSTEM!voice_survey_question.html")
    #end ## for each
    <tr id="captchaRow">
        <td>
    <img src="" alt="captcha image" id="captchaImage"><br/>
        </td>
    </tr>
    <tr id="captchaDescription">
    <td>
    <span class="text">$voiceCaptchaLine</span>
    </td>
    </tr>
    <tr id="captchaRowInput">
    <td>
     <input type="text" id="captchaResponse" name="captchaResponse">
     <span id="captchaMandatory" style="font-size: xx-small; font-family: arial,sans-serif; color: red">*</span>
     <input type="hidden" value="" id="captchaId" name="captchaId">
    </td>
    </tr>


    For example:
    131024095807755 add code below table

  5. Add the following code below the centerContent table:

     <script type="text/javascript">
    if(captchaId && !captchaId.indexOf("{captchaId}") > -1){
    document.getElementById("captchaImage").src = "?cmd=capImage&capImgId=" + captchaId + "&site=${Site}";
    document.getElementById("captchaId").value = captchaId;
    } else {
    var capRow = document.getElementById("captchaRow");
    capRow.parentNode.removeChild(capRow );
    var capRowInput = document.getElementById("captchaRowInput");
    capRowInput.parentNode.removeChild(capRowInput);
    }
    </script>

    For example:
    131024095807755add code below table

  6. Click Update to save the changes.

    131024095807755 click update 1

  7. Click Publish All Changes.
    131024095807755 publish changes
For the call_offline.html customized resource:
  1. Click the 131024095807755edit button button in the call-offline.html line, to enter the edit mode.

  2. Add the following code at the beginning of the HTML code.

    #set ($Site = $request.Parameter.site)
    #set ($voiceCaptchaLine="$!{vsm.VOICE_CAPTCHA_LINE}")

    For example:
    131024095807755 add two lines

  3. Add the following code at the beginning of the Head section:

    <script language="JavaScript" type="text/javascript">
       var captchaId = "${captchaId}";
    </script>
    For example:

    131024095807755 add code

  4. Add the following code at the bottom of the fieldsTable table, which is located within the centerContent table:

    #foreach ($question in $survey.questions)
    #set ($seq = $question.sequence - 1)
    #parse("SYSTEM!voice_survey_question.html")
    #end ## for each

    <tr id="captchaRow"><td><img src="" alt="captcha image" id="captchaImage"><br/>
    </td>
    </tr>
    <tr id="captchaDescription">
    <td>
    <span class="text">$voiceCaptchaLine</span>
    </td>
    </tr>
    <tr id="captchaRowInput">
    <td>
    <input type="text" id="captchaResponse" name="captchaResponse">
    <span id="captchaMandatory" style="font-size: xx-small; font-family: arial,sans-serif; color: red">*</span>
    <input type="hidden" value="" id="captchaId" name="captchaId">
    </td>
    </tr>
    For example:
    131024095807755 add code below table2

  5. Add the following code below the centerContent table:

     <script type="text/javascript">
    if(captchaId && !captchaId.indexOf("{captchaId}") > -1){
    document.getElementById("captchaImage").src = "?cmd=capImage&capImgId=" + captchaId + "&site=${Site}";
    document.getElementById("captchaId").value = captchaId;
    } else {
    var capRow = document.getElementById("captchaRow");
    capRow.parentNode.removeChild(capRow );
    var capRowInput = document.getElementById("captchaRowInput");
    capRowInput.parentNode.removeChild(capRowInput);
    var captchaDescription = document.getElementById("captchaDescription");
    captchaDescription.parentNode.removeChild(captchaDescription);
    }
    </script>

    For example:

    131024095807755add script below table

  6. Click Update to save the changes.

    131024095807755 click update2

  7. Click Publish All Changes.

    131024095807755 publish changes