Name Example Default Comment
node {kind: 101, id: 1234} - kind specifies the type of celum container (101 = folder, 102 = object collection 103 = keyword), id the celum ID of the object, or an array of celum IDs to construct a virtual root node, e.g. {kind: 103, id: [10909, 12246]} (in this case you probably want to set _showroot to true as well)
locale 'de' - Display language. Availability equals those of celum. Fallback if nothing is specified is celum's default language
show 4123 - Activate the node show immediately after initialization (celum-id) or "first"/"last" to select the first/last leaf in the tree.
anchor true false Show the id of the activated node as an #anchor in the URL. Enables users to link/bookmark a specific node directly. Overrides the show parameter if an anchor is found on load.
asset_count true false display how many assets are in this container (slow in 1.x! use on small trees or in combination with lazy loading) - since 1.6
show_root true false display the root node you requested as well - probably only useful for virtual root nodes
show_tags true false show node icons (e.g. colored folders) in the tree - since 1.9
depth 2 0 Depth to which the tree should be loaded (lazy loading). Using a depth < 1 loads the entire tree (requires backend version 1.2 or higher)
callback function(server, kind, id) {/*do something*/} - Function defining the action to be triggered when clicking on a node. If no function has been specified the plugin will look for an existing [gallery](../01.frontend ##Gallery) to show the contents of the node
sort function(a, b) {return -;} null custom sorting function - see MDN
hide_empty true false hide nodes that don't contain any assets (implies asset_count) - sice 2.1
noderef true false consider node referencing information field usages as directly assigned assets (like the navigation context in the CELUM UI) - since 2.0
list_style false true show list style icons in the tree - since 2.2
li_expander true false enable folding of the tree (regardless of the current selection) when clicking on the list style icons - since 2.3


  • The parameter supports arrays, i.e. you can construct a virtual node (to aggregate multiple nodes from different locations) by using {kind: ..., id: [1, 2, 3]}. Set to -1 to get all root nodes (enforces show_root=true; since 1.7).
  • Also available as a horizontal navigation bar (with folding). Simply use jquery.anura.navbar.css instead of jquery.anura.tree.css (suitable for trees up to a depth of 3)
  • Do not initialize the tree before the gallery component when using the show parameter or the URL-state, as this may lead to a race condition


  • anura-loaded (options, data) - triggered when the plugin has loaded all nodes
  • anura-clicked (server, kind, id, name) - triggered when a user clicks on a node/leaf
  • anura-reset - triggered when reset via anuraSearch

Box Model

<div class="anura-tree-container">
      <li class="anura-node anura-active">
         <a><span class="anura-node-name">Parent Node</span></a>
         <ul class="anura-tree-unfolded">
            <li class="anura-node">
               <a><span class="anura-node-name">Child Node</span></a>
               <ul class="anura-tree-folded">
            <li class="anura-leaf">
               <a><span class="anura-node-name">Child Leaf</span></a>
      <li class="anura-node"><!--etc--></li>
      <li class="anura-leaf"><!--etc--></li>



requires backend version 1.5 or higher

Name Example Default Comment
locale 'de' -
widgets [{name: 'text', scope: $('#navigation')}] - Which search components to show and in what order. See widget options.
folder 42 - DEPRECATED (use custom=). Restrict search to this folder - widget.scope overrides this if enabled
keyword 7 - DEPRECATED (use custom=). Restrict search to this keyword - widget.scope or keywords override this if enabled
custom search_infofield=628,1 - Arbitrary arguments sent along with the request (see API search parameters for details)
resettable false true Adds a reset search link to the bottom
show_empty true false Whether to tell the attached view about the lack of search results (otherwise just show a message in search, 1.x only)
extended true false Request extended asset properties (size, modified) etc. - has no effect other than that you could use them for sorting
container_class 'my-class' '' custom class to be added to every widget container div
facets true false enable faceted search on the widgets - requires corresponding configuration of the back-end - since 2.6
Widget Options
{name: 'text', scope: null, resettable: false}, // scope needs an anuraTree of folders or keywords, e.g. $('#navigation'); resettable adds an 'x' to clear the text
{name: 'filetype', style: optional string}, // document type (images, documents, audio, video, others), style: checkbox/dropdown/select
{name: 'assettype', style: optional string}, // asset type (as defined by your infofields.xml), style: checkbox/dropdown/select 
{name: 'keywords', root: keyword id, multiple: bool, show: optional keyword id} // requires jquery.anura.tree 
{name: 'infofield', id: infofield id, style: optional string} // style: dropdown/select/checkbox/radio/tree (availability depends on infofield type)
{name: 'submit', show: true, resettable: true}
  • autosubmit is available on all widgets, set this to true in order to trigger the search immediately (instead of waiting for the "search"-button to be clicked)
  • title may be specified on every widget in order to override the default, either title: "Foo" or title: {de: "Foo", en: "Bar"}
  • _containerclass to override the global _containerclass-setting on this widget
  • tree-containing widgets (keyword, noderef infofield) support a _treesettings-parameter where you can specify additional anuraTree-options that will be applied to the inner tree.
  • node-referencing infofields can enable and_mode: true to search with AND within the same field (instead of the default OR), and recursive: false to disable node recursion (i.e. only accept this exact node). The dropdown-variants also support sort (false, 'asc' (default), 'desc' or a custom sort function).

If you include chosen, all dropdown and multi-select fields will automatically use it.


NodeRef-Infofield with style=tree and collapsible


NodeRef-Infofields with style=select and chosen


NodeRef-Infofield with style=text



  • anura-init-search (options) - triggered after the plugin is done loading the user interface
  • anura-init-infofield-id (options) - triggered after an informationfield widget is done loading (independent of anura-init)
  • anura-loaded (options, assets) - triggered after a search has been executed
  • anura-reset (options) - triggered when the user clicks on the "reset search" button

Box model

<div class="anura-search-container anura-locale-en">
   <input type="text" class="anura-search-text">
   <fieldset class="anura-search-type">
      <input type="checkbox"><label>Images</label><br>
      <input type="checkbox"><label><!--etc--></label>
   <fieldset class="anura-search-keywords">
      <div class="anura-search-keyword-tree">
         <!-- anura-tree-container -->
   <fieldset class="anura-search-infofield">
      <legend>Usage rights</legend>
      <input type="radio"><label>freely available</label><br>
      <input type="radio"><!--etc--></label>
   <input type="button" value="Search" class="anura-search-button">
   <a class="anura-search-reset">Clear</a>



Provides breadcrumbs based on an anuraTree's selection (e.g. [Earth > Europe > Switzerland])

Name Example Default Comment
tree myTree null the anuraTree to listen on (from the $.anuraTree call)
multiMode 'global' 'local' when to switch to multi-mode (tags instead of hierarchy),
one of: "local" (per tree), "global" (over all trees) or "always"
callback function(server, kind, id, name) {...} null called when a node/leaf is clicked


  • anura-clicked (server, kind, id, name) - triggered when a user clicks on a breadcrumb link

Box model


<ul class="anura-breadcrumbs-container">
   <li class="anura-breadcrumb anura-breadcrumb-levels anura-breadcrumb-level-0"><a data-id="3">World</a></li>
   <li class="anura-breadcrumb anura-breadcrumb-levels anura-breadcrumb-level-1"><a data-id="32">Europe</a></li>
   <li class="anura-breadcrumb anura-breadcrumb-levels anura-breadcrumb-level-2"><a data-id="42">Switzerland</a></li>


<ul class="anura-breadcrumbs-container">
   <li class="anura-breadcrumb anura-breadcrumb-multi"><a data-id="42">Switzerland</a></li>
   <li class="anura-breadcrumb anura-breadcrumb-multi"><a data-id="1337">Cheese</a></li>
   <li class="anura-breadcrumb anura-breadcrumb-multi"><a data-id="4123">AOC</a></li>