13

We're using the Web Chat Channel in Microsoft's Bot Framework,and we don't want to use the attachment icon.

How can we hide and disable attachments so end users don't accidentally click it or get confused?

Attachment example

Improve this question
1

1 Answer 1

Reset to default
12
+500

Hide Attachment Icon

Are you currently consuming the WebChat via an iFrame or via the JavaScript implementation? Integrating via JavaScript will give you moderate styling and customizability options.

By modifying the styleOptions object passed into the renderer, you can disable the upload button with minimal effort.

window.WebChat.renderWebChat({
  directLine: window.WebChat.createDirectLine({ token }),
  styleOptions: {
    hideUploadButton: true
  }
}, document.getElementById('webchat'));

Sample - Disable the Upload Button

Disable Attachment Upload

The implementation above doesn't prevent the users from sending attachments to the bot, it will just disable the upload button. In the Azure Bot Service, you could also Block attachment upload from user in the DirectLine settings to disallow attachments on the service.

To disable the upload functionality:

  1. Navigate to your Web App Bot resources

  2. Navigate to Channels and click Edit

    Edit Chat Bot

  3. Check Block attachment upload from user

    Edit Web Chat

Improve this answer
4
  • Currently using the iFrame, but this might be be a reason to switch over to the script if our CMS can support it
    – KyleMit ♦
    Mar 27, 2020 at 16:13
  • 3
    There are many functional and branding reasons to switch over to the Javascript implementation, have a look at the samples. You could also host this page and embed it as an iframe, in case your CMS only supports iframing.
    – Mick
    Mar 27, 2020 at 16:20
  • You're welcome, thanks for clarifying my post for future visitors. :-)
    – Mick
    Mar 27, 2020 at 16:31
  • How do we do this when using styleSet instead of styleOptions? Or can we use both at the same time? Can we pass the options to window.WebChat.createStyleSet()?
    – Martijn
    Dec 15, 2020 at 7:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.