Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I am using the following code for a navigation bar on a WordPress website:

<?php wp_list_pages("title_li="); ?>

Which currently spits out some links that look like:

<a href="http://yoururl.com/?page_id=123">News</a>

What I'd like to do is have the ability to add an id to a link so that it looks like:

<a href="http://yoururl.com/?page_id=123" id="news">News</a>

Does anyone know how to do this? It's ok if just this page or every page has an id...whatever is easiest, I just need an ID so that I can target a specific link.

Thanks,
Josh

share|improve this question
    
You already can access/target a specific link - when using the wrapped around <li> element. wp_list_pages provides unique classes like page-item-{id} for those. –  t f May 2 '13 at 15:53
    
if the links are children of a list element (li), those elements already have specific classes. You could just target the class, instead of adding an ID. Are you using jquery? –  gdaniel May 2 '13 at 15:54
    
Yes, but those links will change if the theme is applied to another website, I was looking for something that could be applied to the theme, that wouldn't need a manual ID change when the theme is added to another site. –  Josh Rodgers May 2 '13 at 21:01

2 Answers 2

Well, you can do it with jQuery, if your links are inside a div with given ID of 'menu', so you could write:

<script type="text/javascript">
var links = jQuery('#menu').find('a');

jQuery(links).each(function(){
jQuery(this).addClass('news'); // It will add a class for all links, not an id
jQuery(this).attr('id', 'news'); // This will add an id, but for all links
}); // choose what do you want, and delete other, if you will not use
</script>

This is just a work-around, and a ugly method since I don't know a WP function to retrieve all pages links, and nobody helped you so, but I think you can Google for it too...

Good luck...

share|improve this answer

I wasn't able to find something that would add an id, but I did find something that would give me a class...this way I can target the class using jQuery. The default id's and classes are ok, but the solution I found is much better because no matter which website you apply it to it will work, I don't ever have to go back and change the link class or id. I was able to find a function that adds a class with the page name...so as long as I make sure the page names remain the same I'm golden :-)

Add to functions.php:

function menu_css_class($css_class, $page){
    $css_class[] = "nav_" . $page->post_name;
    return $css_class;
}
add_filter("page_css_class", "menu_css_class", 10, 2);

Set it and forget it, I love it!

Thanks,
Josh

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.