nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How can I always show the left sidebar on some pages when using the Documentation theme?

Armon Tiongco1

I need some of the pages to always show the left navigation in the documentation theme.

I am thinking of something somewhat opposite to that hiding it. So far, once you hid it on one space, it seems to remember that - so when users navigate from there - the left navigation is still hidden.

We want the left navigation to always remain. Is there a way to completely show this on the page.

Thanks,

Accepted answers

Davin Studer

I asnwered a similar question here and it could be adapted to fit your needs.

https://answers.atlassian.com/questions/212656/how-do-i-show-hide-sidebar-in-the-documentation-theme-depending-on-a-url-parameter

All comments

Davin Studer

I asnwered a similar question here and it could be adapted to fit your needs.

https://answers.atlassian.com/questions/212656/how-do-i-show-hide-sidebar-in-the-documentation-theme-depending-on-a-url-parameter

Davin Studer

You could put this into an HTML macro in the page.

&lt;script type="text/javascript"&gt;
AJS.toInit(function () {
	var splitPos = AJS.$('#splitter .vsplitbar').css('left')
	if(splitPos === '0px') {
		AJS.$('#splitter-button').click();
	}
});
&lt;/script&gt;

Armon Tiongco1

Hi David,

Can you please explain further how this code helps?

&lt;script type="text/javascript"&gt;
AJS.toInit(function () {
    var show = getParameterByName('show_sidebar');
    var splitPos = AJS.$('#splitter .vsplitbar').css('left')
    if((show === '1' &amp;&amp; splitPos === '0px') || (show === '0' &amp;&amp; splitPos != '0px')) {
        AJS.$('#splitter-button').click();
    }
});
 
function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regex = new RegExp("[\\?&amp;]" + name + "=([^&amp;#]*)"),
    results = regex.exec(location.search);
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
&lt;/script&gt;

I already added it but it doesnt seem to work. When i navigate from a hidden left navigation page to another space - the left navigation is still hidden,

Armon Tiongco1

it works! Thank you so much!

Barbara Boros

It's simple as it is:

Macro Name:
collapsesidebar

Macro Title:
Collapse Sidebar

Description:
Collapse sidebar by default (everywhere!)

Macro Body Processing:
No macro body

Template:
## Macro title: Collapse Sidebar
## Macro has a body: N
## Body processing: Selected body processing option
## Output: Selected output option
##
## Developed by: Barbara Boros
## Date created: 08/28/2014
## Installed by: Barbara Boros

## @noparams

&lt;style&gt;
    #main {
        margin-left: 55px !important;
    }
&lt;/style&gt;

Welcome!

It looks like you're new here. Sign in or register to get started.

Quick Links

Find more posts tagged with

confluence

confluence-administration