Bold360 and BoldChat Developer Center

FAQ widgets

The embeddable list displays links to currently popular articles in your knowledge base.

Two widgets are provided for displaying a FAQ list in a web page. They have different appearances, but either one can be used to display the most popular answers in your knowledge base according to specified criteria. (The first FAQ control listed below was introduced more recently and is the recommended choice.)

  • The FAQ SDK component, nanorep.sdk.FAQ, provides a card-based UI.

    To add a FAQ SDK component to your web page, follow these steps:

    1. Go to the FAQ SDK (nanorep.sdk.FAQ) in the Web API and SDK Reference.
    2. Copy the example code into your web page. For example:
      <script src="https://account_name.nanorep.co/web/include.js?sdk=faq"></script>
      
      <div id="faq-example"></div>
      
      nanorep.sdk.init({
        host: 'account_name.nanorep.co',
        account: 'account_name',
        kb: 'kb_name_or_id'
      });
      
      var faqWidget = new nanorep.sdk.FAQ({
        apiParams: { days: 17, items: 9 }
      }, document.getElementById('faq-example'));
    3. Change account_name and kb_name_or_id in the example code to match your own host, account, and kb.
    4. You can further customize the behavior of the SDK using the options, methods, and events documented for the nanorep.sdk.FAQ class.
  • The dynamic FAQ widget provides a simpler widget interface. (This widget is deprecated, so we suggest you use the SDK component described above.)

    To add a dynamic FAQ widget to your web page, follow these steps:

    1. In the Bold360 AI Console, select your knowledge base and go to Touchpoints > Widgets.
    2. Click Dynamic FAQ (JavaScript) in the Dynamic FAQ widget section.
    3. Select your KB and modify the settings as needed to control which articles the widget will display.

    4. Copy the generated code and paste it into your web page. For example:
      <!--do not modify this script -->
      <div id='nrMPContainer_98765'></div>
      
      <script type='text/javascript'>
      var _nRepData = window._nRepData || [];
      /* API here */
      ;
      _nRepData.MPWidgets = _nRepData.MPWidgets || {};
      _nRepData.MPWidgets.Data = _nRepData.MPWidgets.Data || [];
      _nRepData.MPWidgets.Data.push({
          account: 'account_name',
          days: 21,
          items: 20,
          query: 'test',
          kb: '1234567890',
          container: 'nrMPContainer_98765',
          rtl: false
      });
      (function() {
          if (!_nRepData.MPWidgets.mpScriptLoaded) {
              _nRepData.MPWidgets.mpScriptLoaded = true;
              var sc = document.createElement('script');
              sc.type = 'text/javascript';
              sc.async = true;
              sc.defer = true;
              sc.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'my.nanorep.com/widget/scripts/faqWrapper.js';
              var _head = document.getElementsByTagName('head')[0];
              _head.appendChild(sc);
          } else {
              if (typeof(nanoRep) != 'undefined')
                  if (typeof(nanoRep.MPWidget) != 'undefined') nanoRep.MPWidget.loadMPData(_nRepData.MPWidgets.Data.length - 1);
          }
      })();
      </script>
      Note: If the web page is stored as a local file, you will need to load the page using a local HTTP server (localhost) in order to see the widget. See Troubleshooting for more information.