Customization of web widget

20 Comments

  • Nanna Aabentoft Tygstrup

    We could really use an option to customize the chat widget to our needs.

    1
  • Nicole S.
    Zendesk Community Team

    Louise - Have you looked into the Web Widget Customizations Early Access Program? 

    Nanna - If your feedback is related to Zendesk Chat specifically, you may want to share it in the Chat Help Center

     

    Thank you both for sharing your feedback with us!

    0
  • Louise Dissing
    Community Moderator

    Hi Nicole

    Thanks for the quick reply! 

    I took a look at the link you sent me, but it seems like there isn't anything planned for changing the looks/size of the widget nor adding images, unfortunately. 

    0
  • Daniel Aron
    Zendesk Product Manager

    Hi Louise, thank you so much for the feedback! 

    >...wants the widget to be more visual when the customer is searching for help

    I'm assuming this refers to the look of the launcher rather than the Widget once open? In regards to the launcher specifically, some customers choose to create a custom launcher UI and then use our APIs to control showing/hiding the Web Widget. Also, when Chat is the only channel enabled we do offer a Chat Badge launcher design which is a little larger and more visual. This won't work with Help Center enabled as per your example and we don't support adding links to it at the moment. That said, we are considering expanding this design to other configurations of the Widget.

    >we'd like the ability to do a complete makeover of the widget.

    >We would like to be able to customize the widget completely;
       - Change the size/shape of the widget
       - Add custom CSS
       - Add Images, links etc.

    To fully customize the Widget UI, and if Chat is the only channel you are interested in you can use the Chat Web SDK to build your own UI. We are considering expanding this to enable building a full omnichannel Web Widget UI (including Help Center, Talk and Support) in the future.

     

    0
  • David Foster

    I also want to customize the launcher button of the web widget, but for a different reason: On Sep 5th 2019 the default appearance of the launcher button was changed in a major way, such that the new button is larger and obscures important functionality on our website. See screenshot:

    I would prefer to have a built-in launcher button style/configuration that is shorter and lower-profile.

    Absent a built-in launcher button style of that type, I'm looking into building my own launcher button and controlling the appearance of the chat popup window via zE APIs, as another commentor has suggested.

    0
  • Daniel Aron
    Zendesk Product Manager

    Hi David, thanks for the feedback. We don't plan to provide any variants of the Web Widget launcher shape at this stage. That said, you can easily customize the text and color of the launcher using our js apis.

    You can also customize the placement of the widget using the offset api to avoid collisions with other elements of your website design. 

    Finally as you've pointed out, you can always create a custom launcher.

     

    0
  • Sebastian Juul Jensen

    Very much a shame that customizations like these are not possible. I am sure that a large majority of customers and potential new customers would utilize this feature in order to make the experience on site and with the brand more aligned.

     

    0
  • Nicole S.
    Zendesk Community Team

    Thanks for sharing your feelings, Sebastian. Do you have more you can say about how you would customize your Web Widget and what impact it would have on your business?

    0
  • Sebastian Juul Jensen

    Customization is what helps set business apart from the competition and to really make Apps and websites feel unique.

    Customizing the help/chat launcher button and make it square etc would be fantastic. Besides this changing the shape and fonts on both the chat launcher but also in the widget itself.

    Fairly simple, but could do so much for a more seamless customer experience.

    0
  • Nicole S.
    Zendesk Community Team

    Thanks for that additional detail, Sebastian.

    0
  • Miranda Burford
    Zendesk Product Manager

    Hi Sebastian,

    I'm Miranda, the Web Widget Product Manager.  I just wanted to jump in here and say thanks for sharing your feedback.  We're considering how we can bring some additional launcher & widget customisations to our Admin settings to offer more flexibility so your feedback is timely and appreciated.  Whilst I can't make any promises, I've logged your feedback & contact details.  I'll definitely reach out with any news.

    Thanks,

    - Miranda.

    Senior Product Manager, Web Widget

    0
  • Michael Spink

    We're also looking to customize the web widget as it relates to css.  From what we can tell, custom css styles we have in articles do not carry over to the web widget.  It would be nice if we had control over the css within the web widget.

     

    0
  • Miranda Burford
    Zendesk Product Manager

    Hi Michael,

    You're right.  Unfortunately, custom CSS styles cannot be ported across to the Web Widget currently.  I'll log this feedback for future consideration as well.  Thanks so much!

    - Miranda.

    Senior Product Manager, Web Widget

    0
  • Azhar

    Wanted to change the default text of the chat button. We are having only three option in Widget configuration i.e. Help, Support & Feedback. Our client is looking for name like "Chat Now" .

    I tried looking into many support documents, community posts etc and applied few of them but was of no help.

    Please let us know how to change it simply.

    0
  • Miranda Burford
    Zendesk Product Manager

    Hi Azhar,

    Thanks for your message.  It's possible to customise the Web Widget launcher label text to 'Chat Now' using the label API.  You can find information on that here, https://developer.zendesk.com/embeddables/docs/widget/settings#label.

    Hope this helps!

    - Miranda.

     

    0
  • Martijn

    Hi,

    The customization that I am looking for is to add a link/button to the web widget so my customers can open the help center page in a new window. They can now search for articles in the widget and open the original page with the article but it would be nice to have a prominent button that leads directly to the dashboard of the help center. 

    Would something like this be possible?

    Thanks

    0
  • Miranda Burford
    Zendesk Product Manager

    Hi Martijn,

    Thanks for your message.  It sounds like you have contextual help enabled within the Web Widget.  With contextual help, the goal is to surface relevant Help Center articles within the Web Widget itself, rather than link off to Help Center directly.  Unfortunately, it isn't possible to add a custom button which links to the Help Center dashboard.  However, I will log your feature request on our side and reach out to you if we make any progress on this in the future.

    Thanks,

    - Miranda.

     

    0
  • Alejandro Colon

    @martijn

    I believe that there are some current feature requests that are similar to what you are looking for. 

    If you don't mind, add your support so Zendesk can see that this is something that their customers would like to see implemented. 

    https://support.zendesk.com/hc/en-us/community/posts/360046934393-Feature-Request-Add-the-ability-to-change-the-action-of-the-contact-button-on-the-Web-Widget

    https://support.zendesk.com/hc/en-us/community/posts/115000123488-Direct-Link-to-Help-Center-from-Web-Widget

    https://support.zendesk.com/hc/en-us/community/posts/360046934133-Feature-Request-Add-the-ability-to-add-a-link-to-the-Web-Widget

    0
  • Akshar

    Hi All,

    I am trying to customise the web widget by decrease the padding / margin between the labels and input fields so that there is no scroll bar that appears in the web widget.

    is this possible via the JS API? or what workaround could i use.

     

    Thanks in advance.

     

    0
  • Kay
    Community Moderator

    Hi Akshar 👋 this isn't officially supported through an API.

    That being said you could probably get to the iframe of the widget via Javascript like this

    document.querySelector('#launcher').contentWindow.document.querySelector('#Embed').style.border = "red solid 5px";
    0

Please sign in to leave a comment.

Powered by Zendesk