Forums

Digital Skraps

I've never needed or wanted to do this which is odd when i think about it, but i need an active/focus state for the nav in Wordpress. i hard code the ul into the header.php in wordpress.
I need the contact nav item to show focus when on the contact page etc.

I'm not sure how to do this since it'll need to be dynamic being that theres only one index.php and all that.

anybody got some help or a link with a tutorial?

appreciate it!

chriscoyier

Since you say you have hard-coded the nav, your best bet is to probably ID the body using the URL you are on:

<?php
	$url = explode('/',$_SERVER['REQUEST_URI']);
	$dir = $url[1] ? $url[1] : 'home';
?>

<body id=\"<?php echo $dir ?>\">

If you use wp_list_pages to output the navigation instead, it actually automatically appends a special class to the current page you are on in the list, which is wicked handy.

Screencast on this exact concept:
http://css-tricks.com/video-screencasts ... e-body-id/

Digital Skraps

thanks man!
i'll watch the vid tomorrow.

is there a way to control which pages are displayed?
ie if the user creates another page it wont show? that's why i go hard coded. idk how to arrange them the way i want either

thanks for the help!

apostrophe

When you create a page in the WP backend there is an option on the right hand hand side underneath where you chose page parent and page template to give your pages a number to order them, so 1 comes first 2 second etc. Using that you can order your nav menu however you want.
To have wp_list_pages show only the pages you want, use the include paramater listing only the pages you want by id.
eg.

<ul>
  <?php wp_list_pages('include=5,9,23&title_li='  ); ?>
</ul>

You might want to check out the codex http://codex.wordpress.org/Template_Tags/wp_list_pages

curtismchale

Chris why would you use this method instead of just calling <?php the_title(); ?> as the body id?

Digital Skraps

I used Chris' method to establish a page id but I just noticed a problem not addressed in the vid.

What about the home page?

the php strips the "/" but even if it didnt i dont think i can use a class of ./ in css so how do i get the home page which has a WP href of "/" which gets stripped to still apply a body class to just that page and not the search page, or archive page etc.

AshtonSanders

"curtismchale" said:
Chris why would you use this method instead of just calling <?php the_title(); ?> as the body id?

Because the title can have spaces. You could probably echo the page ID if you wanted something simple

"Digital Skraps" said:
What about the home page?

Did you try it? This line of code replaces '' (the home page) with 'home'

"chriscoyier" said:

$dir = $url[1] ? $url[1] : 'home';

Digital Skraps

i used the code that's in the screen cast which isnt what was posted in here. At this point the blog is done and in their hands. im hoping they wont notice but i dont have any more time available to work on it, so the easiest fix is what i need. the code being totally different here and in the screen case leads me to believe its quite a bit more work

apostrophe

I don't understand why you don't just use wp_list_pages, then everything is done for you.

treehouse : what would you like to learn today?

Forums

CSS Active page on Nav in Wordpress