[COMPLETED] Web Widget Customization Options

Completed

105 Comments

  • Aaron Cottrell
    Comment actions Permalink

    Hi,

    Aaron here, I'm the Product Manager for the Web Widget.

    Thanks for your feedback. We do not have any customisation options in development.

    That said, I'm always interested in hearing from our customers: Of the options you have listed above, which would be the most valuable to you and why?

    0
  • APR-B
    Comment actions Permalink

    Hi Aaron, 

    The most important thing for us are the ability to 

    Change the text in the input fields:
    our way of communicating with our customers differs from time to time. We use several widgets on multiple website i.e a B2B website and a consumer website. 

    Change the text on the Help-button
    We'd rather have the 'Support' or change the text to something else that suits the website/customers best. 

     

    1
  • Jean Jimbo
    Comment actions Permalink

    We also have the same requests for the web widget but most critical is the position of the web widget. It would make most sense to us if it were in  the center. 

    Our products are web apps which have a white background and people cannot see the web widget when it pops up (it blends into the background). We have hidden the widget using the APIs to only show when our clients click on an existing support button (zE.activate({hideOnClose: true})). Since our button is at the top and the widget appears at the bottom they never see it. We've been using the Feedback tab which our clients loved and have already told us they miss. 

    This will affect the self-service bit of our zendesk while more tickets are created for questions we've already addressed in our Help Center. 

    So either we have options to change the position, or perhaps be able to modify the colour to improve visibility of the widget. 

    Changing our UI is certainly not an option for us. 

    1
  • Mark Pfeiler
    Comment actions Permalink

    Hi,

    Yes, the Customization of the button and the title of the form is critical!  As it is now I don't think I could use it without changing the text.  "Leave Us A Message" is not a good title for support.  The customer sees that text as saying "We will not be answering your question, but type it out anyway".

    Arron, when can you roll this out?  Love the widget but it's not usable for us with the stock wording.  

    Can it be overwritten with a style sheet?

    Thanks - I love Zendesk!

    Mark

     

     

    2
  • Aaron Cottrell
    Comment actions Permalink

    Hi Mark,

    If you had a second option for the text instead of 'Leave Us A Message' what would it be?

    2
  • Melanie Bunting
    Comment actions Permalink

    I wish that the web widget let you have a field to populate the 'subject' field in the ticket. At the moment have the entire description entered in the widget appearing as the subject is just messy.

    Even if there was a category field that auto populated the subject with a shorter description that would be better. We have a category as a custom field, but we don't have anyway to get this appearing as the subject line. 

    Here's hoping that Zendesk add this in the future.

    3
  • Joshua Bentley
    Comment actions Permalink

    Aaron - great to see you're taking your customers seriously on this one. The two priorities for us in being able to customize the button are:

    1. Position - Bottom left and bottom right don't really work for us. Greater flexibility in positioning besides having us pick a specific quadrant would be great. Then we can decide where it should go.
    2. Text - Our company website already has a lot of links that say "Help" so I'd love to be able to change it to something like "Support" or "Get Answers"
    4
  • Besim Limani
    Comment actions Permalink

    Hi,

    I agree Joshua Bentley:

    1. Change the position of of Help-button
    2. Change the text on the Help-button

    are very important for us.

    1
  • Dave Birch
    Comment actions Permalink

    I would agree with all of these options. Additionally, I think being able to specify a DOM target for the widget to be injected into would be extremely helpful. The way i would imagine it working is as follows:

    Client specifies an empty div element with an id for the widget button to be injected.

    on pageload, Zendesk would then inject the button code to the specified div. The widget would retain all it's normal style and behavior, but the actual button trigger would be able to inherit styles from the main site.

    Thoughts?

    2
  • Jarrett Pumphrey
    Comment actions Permalink

    Aaron, I agree with Mark. "Leave us a message" isn't a great title for the contact form. If it were simply something like "Contact support" it would at least not give the impression that no one is home. But ideally, we'd be able to set it to whatever we want.

    1
  • Kay
    Comment actions Permalink

    There are several option here to alter some stuff, although it's a bit technical.

    Changing the position (load custom CSS on specific elements) and change values on specific elements

    The most common thing we found was altering the position of the widget, I know it's not the most preferred way, but it is possible. Check this out:

    <script>  
    var helpCenterExists = setInterval(function() {  
    
      /* Wait until helpcentre widget is loaded */  
      if ( $('#helpCenterForm').length ) {
    
        /* Change position of widget */
        jQuery("iframe")  
            .attr('style', 'right: 50% !important;');    
    
        /* Alter the text on the widget open button */  
        jQuery("iframe#launcher")  
            .contents()  
            .find('.Button.Button--launcher span')  
            .html('Click me for help!');  
    
        /* Alter the buttons text on widget */  
        jQuery("iframe#helpCenterForm")  
            .contents()  
            .find('.Container.Container--popover .u-textRight input[type=button]')  
            .attr('value','Get in touch');  
    
         clearInterval(helpCenterExists);  
      }  
    
    }, 100);
    </script>
    
    

    Now you have a way to override the CSS on the Widget. The trick here is to load the css after the HelpCentreWidget is loaded.

    If you need any further assistance, let me know.

    1
  • Aaron Cottrell
    Comment actions Permalink

    Hi Kay (and everyone else),

    Changing the position of the widget or doing anything else by overriding the CSS is not supported.

    We continually deploy updates to the widget code so 'hacking' the CSS in this way may result in strange behaviour of the widget on your public website.

    0
  • Kay
    Comment actions Permalink

    Hi Aaron,

    thanks for your quick reply.

    Indeed it is not support, however it is still a solution. One of your first comments stated that you don't have any customizations in the pipeline.

    As you may have realised, having the button only available to the left or right is not enough for several users, including several of our customers. Since there 'save button' and/or menu are common on those positions. 

    For many of them it means, not using the widget at all, developing one of their own ($$$), or dealing with that sometimes there are changes in the widget, where you have to edit them. I prefer to use the widget. 

    @Everybody, while it is not supported, but if you're still looking for a solution, we've have a way to capture the last search query as a subject on new tickets. As I don't want Aaron to go crazy ;-), I'll only post it if you let me know you're interested.

    @Aaron, in regards to changes on the widget as you're stating, are these documented in https://support.zendesk.com/hc/en-us/sections/200623796-Release-notes?

    1
  • Kevin Stansbury
    Comment actions Permalink

    We would love to be able to customize the web widget. (I.e. Change the name)

    Also when a customer clicks on the widget it should have an option to bring up certain links that customers use often.

    0
  • Simon Karlskov
    Comment actions Permalink

    I too am looking for a way to customize the web widget.

    At the moment we are using the old feedback tab customized to fit into our web portal.

    I do understand that you have chosen to make the widget appear in the left or right corner because this makes sense for UI reasons.. However, because this makes sense we are already using these places for menus and notifications of our own.

    This means that while both I as the support manager and the developers like the web widget better than the feedback tab we are still using the latter :(

    Just as you guys, we want our customers to have the best experience possible and that's not the case at the moment.. (although they don't know what they're missing, since they have never seen the new web widget)

    1
  • maxime
    Comment actions Permalink

    Hi every one,

    As a french CRM working with a French Website, the button to start an online chat only says: "Chat" and we believe that this is not the most professional way to enhance a conversation.

    So this customization could actually be helping us a lot.

    Please make it possible to change the text on the button to start the conversation.

     

    Thanks for reading :)

    0
  • Andreas Brændhaugen
    Comment actions Permalink

    I want to be able to control the placement and look of the button. As a team, we've found ourselves in a bind several times because of the inflexibility of the button and have found ourselves making some really uncomfortable UI compromises because of it.

    The menu that pops up is all fine, I believe Zendesk should control that experience. But please, let me choose what the button looks like.

    0
  • Mark Hamilton
    Comment actions Permalink

    Same here. 

    We need to change the text from 'Help' to 'Support' (like Joshua, we have too many other 'Helps' on our sites). We'd like to change 'Chat' as well.

    We'd like control over where we can place the widget. Placing it within the design of our webpages would be better than having it float bottom left or right over other page elements.

    And critically, we need to say something more focused on technical support than 'Leave us a message'. We have students on our sites, and we're using Zendesk for tech support only (we have other channels for pedagogic support, pre-sales questions - and it's not practical for us to use Zendesk for those). So 'Leave us a message' will have students asking our tech team pedagogic support or pre-sales product questions.

    0
  • Bill Cameron
    Comment actions Permalink

    Hi Aaron Cottrell,

    I have a suggestion for your question: If you had a second option for the text instead of 'Leave Us A Message' what would it be?

    It would be really great if we had the option to change it to something like "get in touch" or "message us". It would be best if we could customise this though because everyone probably wants something different.

    A field on the channels/widget/customisation page would be perfect.

    2
  • Craig Mische
    Comment actions Permalink

    My web-site is just myself so having the help widget say "How can we help?" is goofy and a turn off.

    0
  • Mike
    Comment actions Permalink

    Not being able to customize the web widget is literally a deal breaker for us and I think we'll need to find another Support system until this is an option.

    We have invested thousands into the design of our site, and the web widget doesn't match our theme at all. It is crucial that we be able to customize it to match the rest of our sites theme.

     

    0
  • David Moses
    Comment actions Permalink

    I'm really surprised by the length of time that has passed and all these wonderful suggestions that haven't been rolled into the web widget.

    Simply put, the web widget needs much greater customization control.

    * The ability to have multiple web widgets that have different customization properties on each

    * The ability to change the web widget header text

    * The ability to change the web widget button texts

    * The ability to add attachments to the web widget itself 


    4
  • Katie
    Comment actions Permalink

    I agree with David Moses here...it seems that most people are in agreement that it would be most helpful to change the text, and it's puzzling why this is not a feature yet.  I can't imagine that it would be a very difficult update.  I saw on another forum the reasoning from Zendesk is that since the word "Help" exactly precisely fits what the widget does, it would be inappropriate to change it.

    I disagree.  I think if changing the text would make the widget imperfect, but usable, it would be worthwhile.  As it happens, we have decided that since the word "Help" is absolutely not workable for what we need to use the widget for (we'd like the word "Feedback" so we could get quick comments about various features of our website during the beta launch) we prefer to do without a widget entirely.

    I contacted Zendesk about this, and was told to just post here on the forum.  I'm not sure what that will change, since people have been making these requests since at least January.  No one is asking for the widget to be a three-dimensional gumball that bounces up and down and rattles around at the bottom of the screen.  Just. Changing. The. Text.  (More customization would be nice, of course, but that would be the most crucial). 

    Or, even if customization was not possible at this time, if for some reason it's way more difficult than it seems to develop, or perhaps the team is in fact working on the bouncing gumball feature and can't devote the time to it, just having 2, possibly 3 readymade options to choose from..."Help", "Feedback", "Support"....without a single change to the functionality of the widget...would be super easy for Zendesk to change in the code, and would make the difference for many people as far as being able to use this.

    But, I have been repeatedly frustrated with and disappointed by Zendesk, (there are so many details of the Zendesk site itself that are not user-friendly, which is surprising to me, as this is the business they're in) so I'm not holding my breath for a fix on this anytime soon.

    1
  • Marcos Korody
    Comment actions Permalink

    Hello there. Just purchased and started tinkering with Zendesk Support. Awesome experience so far - just suffering on the Widget part. Being able to customize it a little further ( text, especially ) is also a deal breaker for me: my support center is for Brazilian people, and although 'Help' is quite universal ( thanks to the Beatles ), I feel it will be overlooked by my clients because it is not in their native language.

    Any feedback on this would be highly appreciated.

    cheers!

    1
  • Aaron Cottrell
    Comment actions Permalink

    @David/Katie - Thanks for all your suggestions. As the Product Manager for the Web Widget, I do read all customer comments.

    Regarding the Web Widget 'Help' button text - I'm currently looking into offering a couple of 'readymade' options so that customers have a choice of the text displayed on the Web Widget button.

    I realise 'Help' does not fit every use-case. The 'readymade' option route allows the Web Widget to stay full internationalized out of the box (see my answer to Marcos below if you're interested in how that works) - As Katie points out there's also plenty of Zendesk bouncing gumball work going on as well :) so the readymade option route means we can move more quickly on it. Bear with me while I work with our development team - I will provide an update as soon as I can.

    @Marcos - the Web Widget is translated into Brazilian Portuguese out of the box. The widget will look at the browser locale of the end-user and display the widget in that language (so if your web browser is set to Brazilian Portuguese, the Web Widget will display in that language).

    If you want to force the widget to always appear in Brazilian Portuguese for anyone visiting your web page, you can do that with our zE.setLocale JavaScript API method - it's just adding this small piece of code directly after the Web Widget snippet you already have:

    <script>
    zE(function() {
    zE.setLocale('pt-br');
    });
    </script>

    Here's a demo of how the language auto detection works and an example of using setLocale to force the language: http://cl.ly/image/0A1R2O2a2O2i (The only difference from the above piece of code is that I've used 'pt-br' which is the language code for Brazilian Portuguese which is what I'm assuming you want).

    There's more info on zE.setLocale and the rest of the Web Widget API at our developer portal here: https://developer.zendesk.com/embeddables/docs/widget/api

     

     

    1
  • Marcos Korody
    Comment actions Permalink

    @Aaron thanks for the quick response. Both solutions will work fine for now - thank you for the clarification.

    As a side note, it would be good to keep in mind to extend this feature further in the near future, as pointed out by all the people above.

    cheers!

    1
  • Andy Parsons
    Comment actions Permalink

    I'm a bit dismayed that this remains unaddressed. While we love Zendesk for our support team, the bulbous, non-customizable widget button is a huge problem for our application aesthetic. Is there anything in the works? Any workaround for applying CSS? Please take this as an attempt at constructive criticism, this really is an issue for our business and may be a deal-killer in the long run. Thanks.

    1
  • Aaron Cottrell
    Comment actions Permalink

    Hi Andy,

    Thanks for the feedback.

    A number of our customers use their own button to launch (pop-open) the Web Widget.

    This is done by hiding our default Web Widget button using the zE.hide() method (with the JavaScript API) and then calling zE.activate({hideOnClose: true}); when their button is clicked.

    In this way, you can have a button that fits the style of your application but get the benefit of Web Widget functionality.

    You can find more information about the Web Widget API and examples on our developer portal: https://developer.zendesk.com/embeddables/docs/widget/api

    Thanks,

    Aaron

    1
  • Aaron Cottrell
    Comment actions Permalink

    @David/@Katie and anyone else interested,

    We have just pushed out an update that lets you select from some readymade text options for:

    • Web Widget button text (Help [default], Support or Feedback)
    • Contact form button text (Leave us a message [default] or Contact us)

    As mentioned previously, the reason we are not offering full-text customization with these labels is to ensure that the Web Widget continues to work out the box in over 15 languages across desktop and mobile web browsers.

    You will find these new options on your Web Widget admin page:

    Note: Once you have made a change and clicked Save on your Web Widget admin page, you will need to *wait 5 minutes* and then refresh your web page to see the changes reflected in the widget (this is due to the way we cache settings for performance reasons)

    Enjoy.

    Thanks,

    Aaron

    2
  • Tom Maebe
    Comment actions Permalink

    Hi,

    I'm also a fan of more custom options for the widget.
    - widget button text (let us free type instead of limited dropdown option)
    - styling options. The heavily rounded borders curse with our page styles.
    I see no option now to edit the CSS of this button, but to override it on our own site, which isn't very ideal.

    Thank you for considering this.

    1

Please sign in to leave a comment.

Powered by Zendesk