Articles in this section

Create your own "Send Feedback" tab

  • Updated

When you use BugHerd to collect public feedback, we embed a little "Send Feedback" tab onto your page. This tab can be customised by creating your own tab and invoking the click actions yourself. 

For example, if you'd like to simply have the tab on the left hand side of the screen rather than on the right, just add this line:

<script type="text/javascript">
  
  var BugHerdConfig = {"feedback":{"tab_position":"bottom-left"}};

  (function (d, t) {
    var bh = d.createElement(t), s = d.getElementsByTagName(t)[0];
    bh.type = 'text/javascript';
    bh.src = 'https://www.bugherd.com/sidebarv2.js?apikey=YOUR-API-KEY-HERE';
    s.parentNode.insertBefore(bh, s);
  })(document, 'script');
</script>

 

Step 1: hide the built-in tab

Add the following line of code in the BugHerd script tag to stop the normal "Send Feedback" tab from appearing:

<script type="text/javascript">
  
  var BugHerdConfig = {"feedback":{"hide":true}};

  (function (d, t) {
    var bh = d.createElement(t), s = d.getElementsByTagName(t)[0];
    bh.type = 'text/javascript';
    bh.src = 'https://www.bugherd.com/sidebarv2.js?apikey=YOUR-API-KEY-HERE';
    s.parentNode.insertBefore(bh, s);
  })(document, 'script');
</script>

 

Step 2: attach the event to your own element

In your site's HTML, you can add the event that makes the bug reporting options to appear to any DOM element. You can get as fancy as you like with this:

<a id="my_feedback" onclick="_bugHerd.win.bugherd.applicationView.anonymousbar.toggleOptions()">Send Feedback</a>

 

Step 3: hide your tab when user is logged into BugHerd

This is optional, but your send feedback link will not work if your site visitor is logged in and can see the sidebar. It is assumed that you would want them to use the sidebar in this case so don't show them your own "Send Feedback" widget.

<script type="text/javascript">
  function check_bugherd_login() {
   if (typeof(_bugHerd) != 'undefined' && typeof(_bugHerd.win) != 'undefined' && typeof(_bugHerd.win.bugherd) != 'undefined' && typeof(_bugHerd.win.bugherd.application) != 'undefined') {
     if (_bugHerd.win.bugherd.application.getUser() != null && _bugHerd.win.bugherd.application.getUser().id > 0) {
       document.getElementById('my_feedback').style.display = 'none';
     }
   } else {
     setTimeout(check_bugherd_login, 1000);
   }
 }
 check_bugherd_login();
</script>

If you just want to customise or internationalise the text, please follow this link to customise your Send Feedback widget text (link opens in a new tab). 

Related articles