Adding an All Versions Section to your Navigation Bar

This page gives an example of how you might add an 'All Versions' section to your navigation side bar, as currently used in the Confluence documentation, Crowd documentation and the other Atlassian product documentation spaces.

If you are viewing this page online on the Atlassian documentation wiki, you will be able to see the 'All Versions' section at the top left of the navigation sidebar. Below is a screenshot.

A number of people have asked how we do it, so this page gives the answer. For details about creating the navigation side bar itself, please refer to Adding a Navigation Sidebar.

Screenshot: 'All Versions' section (expanded) at top left of navigation bar

Adding the Version Index to the Navigation Sidebar

This is how we added the 'All Versions' section to the sidebar:

• For each product (Confluence, Crowd, Bamboo, etc) there is a page in the Inclusions Library of the ALLDOC space. The page lists all the versions of that product's documentation, linking to the relevant spaces. For example, here is the page for Confluence and the page for Crowd.
  We put the 'all versions' page in ALLDOC because the page is used in a number of different spaces, via the {include} macro. For example, the 'all versions' page may be included:
  • In every documentation space (each version) for the product concerned, such as DOC, CONF29, CONF28, CROWD, CROWD013, CROWD012, etc.
  • As a panel on the documentation home page, as shown in the 'All Versions' panel of the above screenshot, as well as in the left-hand navigation bar.
  • Any other places where useful.
• In each documentation space, there is a page called 'TreeNavigationVersions' like this one or this one, which copies in the content of the above 'all versions' page.
• For each documentation space, the space's page layout now includes two pages instead of just one:
  • The 'TreeNavigation' page, as already described on the page above.
  • The new 'TreeNavigationVersions' page.

Here's the relevant section of our page layout as it is currently for the Confluence documentation (DOC) space:

#if ($action.isPrintableVersion() == false)
<style>
.spacetree * ul{
padding-left:0px;
margin-left: 0px;
}
.spacetree * li{
margin-left: 5px;
padding-left:5px;
}

</style>

<table cellspacing="2" cellpadding="5">
<tr>
<td valign="top" align="left" width="30%" bgcolor="#eeecec" class="noprint">
<div class="tabletitle">All Versions</div>
<div class="spacetree">
#includePage($helper.spaceKey "TreeNavigationVersions")
</div>
<div class="tabletitle">Confluence 2.10 Documentation</div>
<div class="spacetree">
#includePage($helper.spaceKey "TreeNavigation")
</div>
</td>
<td valign="top" align="left" width="70%" class="pagecontent">
<div class="wiki-content">
$body
</div>
</td>
</tr>
</table>
#else
<div class="wiki-content">
    $body
</div>
#end

Adding the Expand/Collapse Functionality to the Version Index

Another question we are asked is how we group the content of the included page under a collapsible control or 'twisty'.

We use the {expand} macro. This is a 'user macro', which means that you can add it to your Confluence site by adding the code into the 'User Macros' section of your Confluence Administration Console. The details are on the Expand macro's documentation page.

RELATED TOPICS

Adding a Navigation Sidebar