TWiki/HierarchicalNavigation.mdwn

   1 # <a name="Hierarchical Navigation"></a><a name=" Hierarchical Navigation"></a> Hierarchical Navigation
   2
   3 **Navigation block that displays the current topic, its parent and children (if any).** %BR% This is intended to be included in other topics, for example in a side navigation bar ([[WebLeftBar]]).
   4
   5 _NOTE: The lookup for parent and children will increase the loading time of your pages._
   6
   7 <div>
   8   <ul>
   9     <li><a href="#Usage"> Usage</a><ul>
  10         <li><a href="#Displaying the Parent - Current"> Displaying the Parent - Current - Children block</a></li>
  11         <li><a href="#Displaying child topics"> Displaying child topics</a></li>
  12       </ul>
  13     </li>
  14   </ul>
  15 </div>
  16
  17 ## <a name="Usage"></a> Usage
  18
  19 Two sections are defined:
  20
  21 - `all`
  22 - `children`
  23
  24 ### <a name="Displaying the Parent - Current"></a><a name="Displaying the Parent - Current "></a> Displaying the Parent - Current - Children block
  25
  26 > %INCLUDE{"%SYSTEMWEB%.HierarchicalNavigation" section="all"}%
  27
  28 generates:
  29
  30 When included in [[WebLeftBar]] (using default Pattern skin) this is styled to:
  31
  32 <div id="patternLeftBarContents">
  33   <p>
  34   </p>
  35 </div>
  36
  37 ### <a name="Displaying child topics"></a> Displaying child topics
  38
  39 > *Child topics:*
  40 >     %INCLUDE{"%SYSTEMWEB%.HierarchicalNavigation" section="children"}%
  41
  42 generates:
  43
  44 **Child topics:**
  45
  46 When included in [[WebLeftBar]] (using default Pattern skin) this is styled to:
  47
  48 <div id="patternLeftBarContents">
  49   <p>
  50   </p>
  51 </div>
  52
  53     %STARTSECTION{name="all"}%<div class="twikiHierarchicalNavigation">
  54     <ul>
  55     %SEARCH{
  56     "parent"
  57     type="query"
  58     topic="%BASETOPIC%"
  59     web="%BASEWEB%"
  60     nonoise="on"
  61     format="<li class='twikiParentTopic'><img src='%ICONURL{parent_gray}%' width='16' height='16' alt='' border='0' /> [[$web.$parent][$parent]]</li>"
  62     }%
  63     <li class='twikiCurrentTopic' style='font-weight:bold;'><nop>%BASETOPIC%</li>%INCLUDE{"%TOPIC%" section="childlist"}%
  64     </ul>
  65     </div><!--/twikiHierarchicalNavigation-->%ENDSECTION{name="all"}%
  66
  67     %STARTSECTION{name="children"}%<div class="twikiHierarchicalNavigation">
  68     <ul>%INCLUDE{"%TOPIC%" section="childlist"}%</ul>
  69     </div><!--/twikiHierarchicalNavigation-->%ENDSECTION{name="children"}%</div>%ENDSECTION{name="children"}%
  70
  71     %STARTSECTION{name="childlist"}%%SEARCH{
  72     "parent.name='%BASETOPIC%'"
  73     web="%BASEWEB%"
  74     type="query"
  75     nonoise="on"
  76     format="<li class='childTopic'><img src='%ICONURL{line_ur_gray}%' width='16' height='16' alt='' border='0' /> [[$web.$topic][$topic]]</li>"
  77     }%%ENDSECTION{name="childlist"}%