Currently the navigation is a single column. I would like to make it capable of being 2 column and to dynamically fill to fit that way.
https://developers.squarespace.com/json-t-directives
I want to know if there is a JSON-T Directive to get the current item being printed in a loop like this:
{.repeated section items}
{.collection?}
{.even?}
<a href="{collection.fullUrl}" class="Header-nav-folder-item{.if active} Header-nav-folder-item--active{.end}" data-test="template-nav">{collection.navigationTitle}</a>
{.or}
{.section externalLink}
<a href="{url}"{.section newWindow} target="_blank"{.end} class="Header-nav-folder-item">{title}</a>
{.end}
{.end}
{.end}
My thought is to create 2 navigation columns based on the number of items in the dropdown navigation. I would get the number of items in the navigation by using this variable directive:
{.var @myLen items|count}
Then I would create another variable to find the halfway point where I should start navigation items to the other column:
{.var @halfLen @myLen/2}
I would then need to know what Item I am iterating on (IE whether it is element 1, 2, etc). I don't know if there is a directive for this though.
After that is known I would be able to first end the first column then start the second column of this navigation menu. This should allow me to make this idea work.
Is there a directive that will allow me to make this work or an alternate solution to making a 2 column layout without hardcoding the header-nav.block file? Thank you.
