1

bear with me here as I explain my problem.

Generated menu via wp_nav_menu, so I have use of the .current_page_item class. The thing is, I've used jQuery to replace the generated link text with some custom images that I have made and I have to use jQuery now to swap out the image so that the button looks "underlined". Now, I've gotten it to work for all of my pages EXCEPT for the Blog page. The Blog page is specified under the Settings > Reading tab, and the Front page = Home, Blog page = Blog.

Here's my jQuery code to try to check if the current page is the blog:

    $('#menu-item-75 a').empty()
        .append('<img id="blog-btn" src="<?php bloginfo('template_url'); ?>/images/blog-btn.png" />');
    // tests if blog page is active, swaps images depending on test result
    <?php if (is_page('Blog')) { ?>
        $('#menu-item-75 img').attr('src', '<?php bloginfo('template_url'); ?>/images/blog-btn-hover.png');
    <?php } else { ?>
        $('#menu-item-75 img').mouseenter(function () {
            $(this).attr('src', '<?php bloginfo('template_url'); ?>/images/blog-btn-hover.png');
        }).mouseleave(function() {
            $(this).attr('src', '<?php bloginfo('template_url'); ?>/images/blog-btn.png');
        })
    <?php } ?>

Any help/tips/advice would be greatly appreciated! Thank you!

* EDIT * Problem hasn't been solved yet, HOWEVER, I think I'm getting close. I tried a few other things:

    <?php if (is_page(get_option('page_for_posts'))) { ?> // doesn't work
    <?php if (get_option('page_for_posts')) { ?> // WORKS, but leaves menu item underlined all the time instead of only if the blog page is active

How can I test this otherwise, so the blog menu item is only underlined when the page is active?

| improve this question | |
1

There's a site option for page_for_posts, so you might try if ( is_page( get_option('page_for_posts') ) ).

Edit: According to the Codex, is_home() will tell you if you're on the blog page when you have a static front page: http://codex.wordpress.org/Conditional_Tags#The_Main_Page. I can't test it right at this moment, but if that's true, then that must be what you're looking for. I guess I hadn't had to do this before, really good to know.

| improve this answer | |
  • Good tip, I didn't know about that option. Unfortunately, it didn't solve my problem :( any other ideas? – user6674 Sep 13 '11 at 5:35
  • I'd actually probably try using the class feature of the nav menus to accomplish what it sounds like you're trying to do. You could then use CSS to hide the text and set a background image that changes on hover. You can turn on classes in Screen Options up at the top on the nav menu admin screen. – helenhousandi Sep 13 '11 at 14:34
  • I feel stupid, I didn't even think of that...thank you though, I'll try it out and let the world know! – user6674 Sep 13 '11 at 17:01
  • No, don't feel stupid! It's pretty well-hidden :) – helenhousandi Sep 13 '11 at 17:26
  • I came close to an answer, please review my original question to answer the changes I made at the bottom. – user6674 Sep 13 '11 at 20:05
0

RESOLVED

Egads! After lots of trials, I found a post somewhere that mentioned using the $pagename global variable to reference the page slug. Here's my working test to see if blog page is active (the slug is 'the-blog'):

    <?php if ($pagename == 'the-blog') { ?>

Simple enough, eh? Thanks @helenhousandi for your advice and tips!

| improve this answer | |
  • It works if the page slug is always going to be the same. I think I've found out something that I didn't know before, so I'm going to update my answer :) – helenhousandi Sep 13 '11 at 22:03

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy