WordPress.org

Ready to get started?Download WordPress

Forums

current_page_item in wp_list_pages not working right (10 posts)

  1. maestro42
    Member
    Posted 6 years ago #

    here is the code that I am using:

    <?php
    $my_pages = wswwpx_fold_page_list('title_li=&echo=0', TRUE);
    $my_pages = str_replace('<li class="page_item"><a ', '<li><a class="page_item" ', $my_pages);
    $my_pages = str_replace('<li class="page_item page_folder"><a ', '<li><a class="page_item page_folder" ', $my_pages);
    $my_pages = str_replace('<li class="page_item current_page_item page_folder"><a ', '<li><a class="page_item current_page_item page_folder" ', $my_pages);
    echo $my_pages;
    ?>

    Here is the correlating .css code:

    .current_page_item a {
    	color: #000000;}
    .current_page_item a:hover {
    	color: #000000;}

    However, when I visit the page - it does not turn the current page item link black - and hovering doesn't go black either. Not sure what I am doing wrong.

    Any advice would be appreciated!

    Thanks!

  2. iridiax
    Member
    Posted 6 years ago #

    I don't see wp_list_pages anywhere in your code... Are you using a plugin for this?

  3. csleh
    Member
    Posted 6 years ago #

    I don't know what your code means, but it looks like it's replacing stuff so that the li no longer has the class, the a does. Have you tried

    a.current_page_item {color:#000;}
    a.current_page_item:hover {color:#000;}

    I'm not certain the hover code is correct here

  4. maestro42
    Member
    Posted 6 years ago #

    sorry i was using the fold_page_list plugin.

    for some reason it would not work with the

    <li> tag or the <a> tag - so I added an <h5> tag to every link and that seemed to work:
    code:

    <?php
    $my_pages = wswwpx_fold_page_list('title_li=&echo=0', 2);
    $my_pages = str_replace('</a>', '</a></h5>', $my_pages);
    $my_pages = str_replace('<li class="page_item current_page_ancestor page_folder"><a ', '<li><h5 id="tms" class="page_item"><a ', $my_pages);
    $my_pages = str_replace('<li class="page_item"><a ', '<li><h5 id="tms" class="page_item"><a ', $my_pages);
    $my_pages = str_replace('<li class="page_item page_folder"><a ', '<li><h5 id="tms" class="page_item"><a ', $my_pages);
    $my_pages = str_replace('<li class="page_item current_page_item"><a ', '<li><h5 id="tms" class="current_page_item"><a ', $my_pages);
    $my_pages = str_replace('<li class="page_item current_page_item page_folder"><a ', '<li><h5 id="tms" class="current_page_item"><a ', $my_pages);
    echo $my_pages;
    ?>

    and .css:

    #tms {
    	font-size: 11px;
    	padding: 5px 0;
    	font-weight: bold;
    	line-height: 15px;}
    .current_page_item a {
    	color: #000000;}
    .page_item a {
    	color: #0A4E7F;}
    .page_item a:hover {
    	color: #147ECA;}

    Seems to work now! Now all I have to do is figure out how to hide some pages with the fold_page_list plugin and I am all set!

  5. csleh
    Member
    Posted 6 years ago #

    It worked because it took the class out of the a (see my previous post), and put it in the h5. Fine. But you've given each h5 an id, which is a no-no. IDs occur once on a page, classes can be used over and over.

  6. maestro42
    Member
    Posted 6 years ago #

    you are right. let me go see if I can change that up.

  7. maestro42
    Member
    Posted 6 years ago #

    for anyone who cares:

    <?php
    $my_pages = wswwpx_fold_page_list('title_li=&echo=0', 0);
    $my_pages = str_replace('</a>', '</a></h5>', $my_pages);
    $my_pages = str_replace('<li class="page_item current_page_ancestor page_folder"><a ', '<li><h5 class="tms page_item"><a ', $my_pages);
    $my_pages = str_replace('<li class="page_item"><a ', '<li><h5 class="tms page_item"><a ', $my_pages);
    $my_pages = str_replace('<li class="page_item page_folder"><a ', '<li><h5 class="tms page_item"><a ', $my_pages);
    $my_pages = str_replace('<li class="page_item current_page_item"><a ', '<li><h5 class="tms current_page_item"><a ', $my_pages);
    $my_pages = str_replace('<li class="page_item current_page_item page_folder"><a ', '<li><h5 class="tms current_page_item"><a ', $my_pages);
    echo $my_pages;
    ?>

    and change in the .css
    the #tms to .tms

  8. maestro42
    Member
    Posted 6 years ago #

    Do you know why it doesn't work in the
    <li> or <a> tags, but it does in the <h5>?

  9. csleh
    Member
    Posted 6 years ago #

    Yes, because of WHERE the class is put. The code from fold page is changing the class from being in the <li> to being in the <a>.
    This css:

    .current_page_item a {
    	color: #000000;}
    .current_page_item a:hover {
    	color: #000000;}

    is saying "something with a class of current_page, that is then a link, should look like this." (<li class="current_page"><a...>)

    Thus, this would work:

    a.current_page_item {color:#000;}
    a.current_page_item:hover {color:#000;}

    because it is saying "a link with the class current_page should look like this" (<li><a class="current_page...>)

    when you added the <h5>, the class was then attached to that, taking the class out of the <a> again.(<li><h5 class="current_page"><a...>)

  10. maestro42
    Member
    Posted 6 years ago #

    Okay. That makes sense. Thanks. The reason that I was taking the class out of the <li> tag was because when children became involved - and you were on the parent page the list looks like this:

    <li>
    <ul>
    <li></li>
    <li></li>
    </ul>
    </li>

    So if you are on the first parent <li> tag and it gets the .current_page_item class, it filters down to everything within the <li> tag - which was the <ul> and children <li> under it. This wasn't what I was trying to accomplish.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.