Configure Contact Form


The contact form is an additional feature which makes it possible to have the customer fill in a contact form, when the WebChat is a non-available state.



Before proceeding installation, please ensure following prerequisites are met.

  • Installed Webchat

  • Installed Webchat Plus Webservice


Configure Contact Form

To enable and configure this form, the following steps must be done

  1. Open the Settings.xml from C:\inetpub\wwwroot\WebChat_ucc_name\sfbwebchatplus\xml\settings.xml

  2. Set the enabled value to true

  3. Done, other items are optional





<question type="name" placeholder="Fill in you name here">What is your name?</question>

<question>Please enter you email address.</question>

<question type="textarea">Please enter your message.</question>



With the <showonstatus> key, you can determine when you want this contact form to be displayed.












(Optional) Show Contact Us Button

If you are using the out-of-the-box template, you will need to customize your template, Learn More

Below an example on how you can add the contact us button to the default template.

  1. Open the settings.xml, located in your webchat folder:


  2. Change the following setting to true:


  3. Open the templates.html located in your webchat folder:


  4. Replace the content with

    <!--Anywhere365 Webchatplus custom jsrender template file-->

    <!-- Custom templates file, also add corresponding javascript/jquery in custom_assets/js/anywhere365_sfbwebchatplus_presence_custom.js file-->

    <!-- Start Anywhere365 Webchat Custom Presence Templates -->

    <!-- add more templates if needed, eg: -->


    <script id="yourCustomPresenceItemInPageTemplateId" type="text/x-jsrender">

    <div class="anywhere365PresenceItem" {{if Status == 3500}} style="cursor: pointer;" {{/if}}>

    <div class="presenceImages">

    <img id="presenceChatAnywhere365" class="person" src="{{: WebChatRootUrl }}sfbwebchatplus/images/status/default_{{: Status}}.png" alt="Start webchatplus" />


    <div class="chatName">{{: WebChatGroupName }}</div>

    <div class="status" style="display: none">{{: Status }}</div>

    <div class="callmeThe CallMe feature adds a button on your website where the customer can enter his / her number to be called by the UCC, saving the customer in telephone costs." style="display: none">{{: CallMe }}</div>




    <!-- Start Default Anywhere365 Webchat Presence Templates -->

    <script id="presenceItemInTab" type="text/x-jsrender">

    <div class="anywhere365PresenceItem sidebarPresence {{if Status == 3500}}presenceOnline{{else Status == 6500}}presenceBusy{{else Status == 15500}}presenceAway{{else Status == 18000 || Status == 0}}presenceOffline"{{/if}}">

    <div class="anywhere365presence">

    <div class="chatName">{{: WebChatGroupName }}</div>

    <div class="status" style="display:none;">{{: Status }}</div>

    <div class="callme" style="display: none">{{: CallMe }}</div>

    <div class="statustxt"> {{if Status == 3500}}<span class="green">Available</span>{{else Status == 6500 }}<span class="red">Busy</span>{{else Status == 15500}}<span class="yellow">Away</span>{{else Status == 18000 || Status == 0 }}<span class="gray">Offline</span>{{/if}}</div>

    {{if Status != 3500}}

    <div class="contactuspresence">

    <!--<div class="contactuspresencetxt"><span>Our opening hours: </br>M-F : 8am to 8pm </br>Sat : 9am to 3pm</span></div>-->

    <input type="button" class="contactuspresencebutton" value="Contact us"/>


    <div style="clear:both;"></div>


    <div class="sortOrder" style="display: none">{{: SortOrder }}</div>


    <div class="presenceImages">

    {{if WebChatGroupNameImagesEnabled == true }}

    <img id="presenceChatAnywhere365" class="person" src="{{: WebChatRootUrl }}sfbwebchatplus/images/status/{{: WebChatGroupName }}_{{: Status}}.png" alt="Start webchatplus" onerror="javascript: this.src='{{: WebChatRootUrl }}sfbwebchatplus/images/status/Default_{{: Status}}.png'" />


    <img id="presenceChatAnywhere365" class="person" src="{{: WebChatRootUrl }}sfbwebchatplus/images/status/Default_{{: Status}}.png" alt="Start webchatplus"/>





    <!-- End Default Anywhere365 Webchat Presence Templates -->

    <!-- End Anywhere365 Webchat Custom Presence Templates -->

  5. Do a IIS reset