Recent searches
No recent searches
Default Collapsible sidebar to expand
Posted Feb 26, 2019
I am using the Copenhagen theme controls to display the Article list in the collapsible sidebar on the articles and the sections page. (Ideally, I want a full tree control with all sections, subsections, and hierarchies, but the partners have not figured this out yet.
Because I am displaying only articles in the same section, I'd like them to display expanded by default. Right now they expand collapsed. Could you please help me to expand by default? Looks like it should be.
My JS from Copenhangen
// Toggles expanded aria to collapsible elements
$(".collapsible-nav, .collapsible-sidebar").on("click", function (e) {
e.stopPropagation();
var isExpanded = this.getAttribute("aria-expanded") === "true";
this.setAttribute("aria-expanded", !isExpanded);
console.log (isExpanded);
});
My HBS
{{!--Copehangen sidebar--}}
<section class="article-sidebar">
<section class="section-articles collapsible-sidebar">
<h3 class="collapsible-sidebar-title sidenav-title">{{t 'articles_in_section'}}</h3>
<ul>
{{#each section.articles}}
<li>
<a href="{{url}}" class="sidenav-item {{#is id ../article.id}}current-article{{/is}}">{{title}}</a>
</li>
{{/each}}
</ul>
{{#if section.more_articles}}
<a href="{{section.url}}" class="article-sidebar-item">{{t 'see_more'}}</a>
{{/if}}
</section>
</section>
0
5 comments
Dan Ross
Hey Amy,
Can you provide a screenshot for what you're seeing and on which template? Ideally, a link to a page with the issue would be best. I'm working off a test copenhagen theme and i'm not see any expand/collapse function available for the part of the template you're describing.
Thanks
0
Amy Gracer
Hi Dan,
Here is my super modified version - with flexible hierarchies by default:
https://ddisys.zendesk.com/hc/en-us/articles/360018618634-Set-up-product-lines.
It appears collapsed.
But if I view the article in the copenhagen theme with no modifications, it appears expanded.
But the code for that collapsible sidebar is exactly the same in copenhagen and my modified theme.
0
Trapta Singh
Hi @Amy Gracer
In your style.css file at line no. 1721 remove max-height: 44px; and you will be good to go.
Let me know if this solves your issue.
Team Diziana
0
Amy Gracer
@Team Diziana: That did it! Thank you!
0
Amy Gracer
@Team Diziana Is there a way to use this for sections in section?
0