Generating a navigation with dynamic active class about handlebars-helpers HOT 11 CLOSED

I think this is just a case of how the handlebars context works. Try using ../../page.basename .

Sorry... typing on my phone.

from handlebars-helpers.

I'm working on some navigation helpers too, I'd like to make this easier

from handlebars-helpers.

@doowb actually ../page.basename worked but only for two links/pages I don't know why the third didn't work.

@jonschlinkert This will be great.

from handlebars-helpers.

In case anyone is looking for it, I believe this is some of the navigation helper documentation @jonschlinkert was referring to above.

from handlebars-helpers.

@ahmedelgabri after seeing this again, I just noticed that you had a space in the "about us" name and the page.basename probably doesn't have a space. I'm not sure if that could have been your issue.

Also, @andymcfee thanks for pointing to those documents. @jonschlinkert I noticed that he used an anchor tag to jump to that location. Did you ever get the anchor plugin added to the assemble docs?

from handlebars-helpers.

I manually added that anchor tag to the url.

from handlebars-helpers.

Also, I found the "../../" trick explanation in the Assemble Docs, but it was very brief and while it does work to fix the problem, it still feels like complete magic to me. Could someone point me to a blog/documentation for handlebars or whatever that explains what exactly is going on there?

from handlebars-helpers.

Yeah, the Handlebars Paths documentation talks about how to access parent context. Unfortunately for us Handlebars doesn't provide a root variable or just find the correct property like Mustache does. Hope this helps.

from handlebars-helpers.

@ahmedelgabri and @andymcfee we've added a couple of things that will help you in creating this navigation.
We added a property on the pages in the pages collection called isCurrentPage.

@jonschlinkert also created this isActive handlebars helper that will use the isCurrentPage property and generate a class="active" attribute on your element. See the example for details on setting it up. You're also able to provide your own css class if you don't want to use active.

I hope this helps. I'm going to close this issue, so re-open if you think it needs to be open.

from handlebars-helpers.

Thanks @doowb

from handlebars-helpers.

By chance is there a way to do this for gulp? The isActive helper does not work for me nor do the methods above.

from handlebars-helpers.