Search code examples
azurebotframeworkchatbot

Persistent menu with Microsoft Botframework

How to add a persistent menu to Microsoft Bot framework? I searched in the documentation but I do not find much information about UI components. I want to achieve something like the persistent menu of Messenger bot

enter image description here 

  <script>
    var speechOptions = {
    speechRecognizer: new CognitiveServices.SpeechRecognizer( { subscriptionKey: '***********' } ),
    speechSynthesizer: new CognitiveServices.SpeechSynthesizer(
        {
            subscriptionKey: '*************',
            gender: CognitiveServices.SynthesisGender.Female,
            voiceName: 'Microsoft Server Speech Text to Speech Voice (en-US, JessaRUS)'
        })
}


        BotChat.App({

        //production evironment
        directLine: { secret: '**********************' },
        user: { id: Date.now().toString(), name: 'You'},
        bot: { id: '1234' },
        resize: 'detect',
        speechOptions: speechOptions
      }, document.getElementById("bot"));
    </script>
Solution

  • For starters, it looks like you are using Web Chat v3 which is sunset and no longer supported. I would highly recommend migrating to v4.

    There is currently an issue open in the Web Chat Repository to add a sample for a persistent menu. You can track that issue here.

    In terms of creating your own persistent menu, take a look at this Stack Overflow question. You can add a persistent menu to the window and then dispatch actions to the Web Chat store when the user clicks the action. I imagine you could do something similar in v3 and post an activity from the botconnection instead.