6

Adding a submenu for Forums item with a list of categories (Web portal)

For fast forum navigation you can add a dropdown submenu for Forums item. Submenu will contain a list of categories.

To do it add next script to Global Javascript  widget.

var menu_html='<ul class="menu-drop"></ul>';
$j('li.tab_forums').append(menu_html);

var s_zurl = "/api/v2/categories.json";

new Ajax.Request(s_zurl,
{
method:'GET',asynchronous: true,onSuccess: function(transport)
{
var obj = transport.responseText.evalJSON();
$j.each(obj.categories, function () {
var id=this.id;
var name = this.name;
$j('li.tab_forums ul.menu-drop').append('<li data-menu-item-name="cat\_'+id+'"><a href="/categories/'+id+'">'+name+'</a></li>');
});
}
});

8 comments

  • 0

    It's sad but acces to list of categories is admin only for non-enterprise accounts. If you use Regular or Plus you should list of categories directly in script.

    List Categories

    GET /api/v2/categories.json

    Availability

    Accounts that have forum categories

    Allowed For:

    • Admins on non-enterprise accounts
    • Admins and agents will full forum access on enterprise accounts
  • 0

    ... like this

     

    var menu_html='<ul class="menu-drop"></ul>';
    $j('li.tab_forums').append(menu_html);

    var categories = [20036768, 20005516, 20038322];
    $j.each(categories, function(index, value) {
    //alert(index + ': ' + value);
    var s_zurl = "/api/v2/categories/"+value+".json";
    new Ajax.Request(s_zurl,
    {
    method:'GET',asynchronous: false,onSuccess: function(transport)
    {
    var obj = transport.responseText.evalJSON();
    $j('li.tab_forums ul.menu-drop').append('<li data-menu-item-name="cat\_'+obj.category.id+'"><a href="/categories/'+obj.category.id+'">'+obj.category.name+'</a></li>');
    }
    });
    });

  • 0

    I'm trying to change it to show forums instead of categories.

    When i change script to this:


    var menu_html='<ul class="menu-drop"></ul>';
    $j('li.tab_forums').append(menu_html);

    var s_zurl = "/api/v2/forums.json";
    new Ajax.Request(s_zurl,
    {
    method:'GET',asynchronous: false,onSuccess: function(transport)
    {
    var obj = transport.responseText.evalJSON();
    $j('li.tab_forums ul.menu-drop').append('<li data-menu-item-name="frm\_'+obj.forums.id+'"><a href="/forums/'+obj.forums.id+'">'+obj.forums.name+'</a></li>');
    }
    });

     

    Only "undifined" appears. Curl seems to returns right data on that API command.

    Any advice?

  • 0

    Ah, nevermind, just used your previous code.

     

    var menu_html='<ul class="menu-drop"></ul>';
    $j('li.tab_forums').append(menu_html);

    var s_zurl = "/api/v2/forums.json";

    new Ajax.Request(s_zurl,
    {
    method:'GET',asynchronous: true,onSuccess: function(transport)
    {
    var obj = transport.responseText.evalJSON();
    $j.each(obj.forums, function () {
    var id=this.id;
    var name = this.name;
    $j('li.tab_forums ul.menu-drop').append('<li data-menu-item-name="cat\_'+id+'"><a href="/forums/'+id+'">'+name+'</a></li>');
    });
    }
    });

     

     

    Now any user can only see forums that he's able to.

  • 0

    I noticed that this only works for logged in users. Is there a way to alter this so that the submenu choices display the appropriate categories for non-logged in users?

  • 0

    Hi Hannah,

    Yes, now it works only for logged-in users.

    Take a look on other version for all types of user. It requires to set a category id in list. A Category ID you can get from URL. Last numbers: https://your_account.zendesk.com/categories/20038322

    var menu_html='<ul class="menu-drop"></ul>';
    $j('li.tab_forums').append(menu_html);

    var categories = [20036768, 20005516, 20038322, 20090521, 20004768, 20002886, 20083411, 20059843, 20004763];
    $j.each(categories, function(index, value) {
    //alert(index + ': ' + value);
    var s_zurl = "/api/v2/categories/"+value+".json";
    new Ajax.Request(s_zurl,
    {
    method:'GET',asynchronous: false,onSuccess: function(transport)
    {
    var obj = transport.responseText.evalJSON();
    $j('li.tab_forums ul.menu-drop').append('<li data-menu-item-name="cat\_'+obj.category.id+'"><a href="/categories/'+obj.category.id+'">'+obj.category.name+'</a></li>');
    }
    });
    });

  • 0

    Thanks, Mikhail! (Nice to see you. :)

  • 0

    Perfect thank you! This actually solves two problems in one! I was wanting to leave out a couple categories that we rarely use (archives)  from the list, so now I can only add in the categories I want to display in the dropdown.

Please sign in to leave a comment.