How to generate SMINT.js menu output with wp_nav_menu?
-
Hello gents and ladies,
I’m a rookie in theme development, just started and my aim is to create a theme with the next widgets/systems included:
- SMINT.js (one page website, with sticky menu) : http://www.outyear.co.uk/smint/
- On Scroll Effect Layout (from Codrops): http://tympanus.net/codrops/2013/07/18/on-scroll-effect-layout/
- and ofcourse WordPress
I’m creating this theme for a professional dancer and i thought the combination would be nice, but i reached my first barrier and that’s:
– creating the right menu output from wp_nav_menu() (i like it clean):
<nav class="row globalnav"> <a href="#" id="Home">Home</a> <a href="#" id="Biografie">Biografie</a> <a href="#" id="Lessen">Lessen</a> <a href="#" id="Workshops">Workshops</a> <a href="#" id="Fotos">Fotos</a> </nav>
smint.js hooks the id=”…” from
<a>
, in this case “Home”, with a <div class=”home”> down the page, to auto scroll down to it.
You can create custom id’s for</a><a>
like: id=”section1″ untill id=”section5″, but i thought it would be easier (later on) for (me in combination with) wordpress to generate the same<a>
as the name of the Page, to eventually post the content of the Page inside the same named<div class="...">
like above.
Maybe this is the wrong approach from a SMACCS or OOCSS kind of view, but it’s a start to get the thing rolling.
The lady has to be able to customize the content of the pages etc…Now i’m a rookie with javascript and php as well, so editing the smint.js is too hard. So i started with researching: http://codex.wordpress.org/Function_Reference/wp_nav_menu
and i found http://css-tricks.com/snippets/wordpress/remove-li-elements-from-output-of-wp_nav_menu/Eventually my conclusion is: i have to create a custom walker function with Walker_Nav_Menu. Please correct me if i’m wrong or if you know a better solution!
This is where i bub my head to the wall. Could someone help me out?
Thank you in advance
[Moderator Note: Please post code & markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]
-
Hi,
don’t know if you resolved the problem, but since I had same problem and had spent enough time finding the way, here’s the link to the procedure that worked for me.
http://www.stackoverflow.com/questions/21423284/how-to-create-a-sticky-navigation-like-smint-for-wordpress/22258140#22258140Best regards
Thanks senor!
- The topic ‘How to generate SMINT.js menu output with wp_nav_menu?’ is closed to new replies.