Dynamic FAQ

Integration - Dynamic FAQ

The search field of the dynamic FAQ is generated by a javascript script. It can also consist of images and other elements depending on the customization that has been performed.

HTML code

To integrate the dialog box, these files must be hosted on a file server.

The page that should host the dynamic FAQ must reserve a location where the fieldbox and the results will be displayed.

Generally, a dedicated page is kept for this module with only undefined header and footer.

An HTML node with an identifier must be present. This identifier will be used by javascript to build the graphic elements in the page.

Below, an example HTML code for integration of the fieldbox.

This HTML file is hosted in the same directory as the chatbox.js file.

The DOCTYPE tag at the top of the file is absolutely necessary for the proper functioning of the dialog box.

In addition, the script tag has to have the attribute id=dydufieldbox.

Context variables

To enable the identification of the user and to customize the answers, it is possible to use the dialog engine or to display to the Livechat operator information from the website itself:

• Contents of page elements:

  • basket amount;

  • user name;

  • error code currently displayed;

  • etc.

  • Variable values ​​or javascript functions;

  • Cookie values.

The retrieval of this information generally does not require to edit the site that includes the dialog box, except if you want to retrieve information that is not present at the time of integration.

The declaration of context variables is done in this way:

getMontantPanier is the javascript function that gets the name of this shop.

It can be defined either in the dialog box or by another script if it is loaded on the same pages as the dialog box.

Writing functions for context variables can be done by the customer's teams as well as by our teams.

Debugging

To check if the context variables are functional, go to the page where the dynamic FAQ has been integrated and ask any question in the fieldbox.

In the Network tab of the Developer tools panel, you must locate the last talk request:

In the parameter list, find the contextVariables parameter.

This list should include the list of context variables that have been saved in DYDUServlet, with their value encoded in base64.

In this example, you can see the two variables first_name and last_name:

• first_name is Sm9obg== base64 ("John");

• last_name is RG9v== base64 ("Doo").

Browsers to be tested

Desktop web browser	Version	Compatibility
Microsoft Edge	≥ 80	Total
Mozilla Firefox	≥ 68	Total
Apple Safari	≥ 13.0	Total
Google Chrome	≥ 83	Total

Mobile terminal	Version	Compatibility
iOs	≥ 10	Total
Android	≥ 6.0	Total

The proper operation of the following elements needs to be checked:

• The input field;

• The send button;

• Autocomplete: suggestion when writing.

When a question is asked, you should see:

• The topics of the proposed FAQs;

• The titles of the FAQs;

• Related answers;

• Satisfaction (optional – and only on FAQs related the knowledge base, ie it does not concern the FAQs from external indexing).

Interactions

1. Ask a question

This process should be tested by sending a request by pushing Enter or by clicking on the Ask button.

2. Redirect link to another knowledge

Some knowledge may contain a link in their answer to allow access to another knowledge, it is therefore necessary to identify a knowledge using these redirect links and check that the use of this link displays the targeted knowledge.

3. Link to another page

Some knowledge can contain in their answer a link allowing access to another page of the site, it is necessary to identify a knowledge using these links and check that the use of this link causes the page change. Clicking on this type of link causes a query to the dialogue server so as to track the usage that is made by the users.

4. Empty input field

When the input field is empty, it must not not be possible to submit the request to the server, as well by pressing Entry in the input field only by the send button. This send button must also be grayed out or inactive.

5. Decision trees

When a knowledge includes a decision tree, it is necessary to check that clicking on the "+" icons displays the sub-branch replies.

6. Redirect URL

When a knowledge is configured with a redirect URL, check that the FAQ title becomes clickable or that a clickable link appears next to the FAQ.

7. Url of the question asked

You have to check that the URL of the page of the asked question uses the terms of the question.

8. Returns and page changes

When two questions are asked one after the other, going back to the previous page has to display the first question again. It should also be the case when changing pages and going back to the asked question.