Support » Themes and Templates » Listing Pages In Custom Navigation without “List”s?

  • opq

    (@opq)


    Hi,

    I’m trying to create a custom navigation for my pages. I know there is a wp_list function but that seems to generate a list with HTML list tags.

    How can I get WordPress to return links of all teh pages (or a selection of the pages) present in WP in one line separated by spaces?

    i.e. if I have the pages PAGE1 PAGE2 and PAGE3;

    how can I make it return: “PAGE1 PAGE2 PAGE3”
    instead of:
    – Page1
    – Page2
    – Page3

    Thanks!

Viewing 12 replies - 1 through 12 (of 12 total)
  • moshu

    (@moshu)

    Not really a WP question – it’s about learning CSS if you want to mess around with your theme 😉
    http://css.maxdesign.com.au/listamatic/

    opq

    (@opq)

    Do I have to do it by CSS? Is there no way to loop through each page name and url?

    JaneLitte

    (@janelitte)

    you need to turn your lists into inline lists and that must be done with the css. This is the code from the codex:

    #navmenu ul {margin: 0; padding: 0;
    list-style-type: none; list-style-image: none; border-left: 1px solid #000; }

    #navmenu li {display: inline; border-left: 1px solid #000;}
    #navmenu ul li a {text-decoration:none; margin: 4px;
    padding: 5px 20px 5px 20px; }

    ‘#navmenu ul li.first { margin-left: 0; border-left: none; list-style: none; display: inline; }’

    The last one is so that you don’t get the “|” to show up before the first listed item.

    Then you would put in your index.php or header.php or wherever you wanted the list to show up:

    <div id="navmenu">
    <ul>
    <li><a href="">Page 1</a></li>
    <li><a href="">Page 2</a></li>
    <li><a href="">Page 3</a></li>
    </ul>

    and it should render this list:

    Page 1 | Page 2 | Page 3

    There is a great tutorial here: Tutorial

    opq

    (@opq)

    Thanks a lot for the help!

    Yeah but I was wondering what would happen to ‘submenus’ with pages that are under a specific page.

    What if originally I have:

    Page 1
    –> Page A
    –> Page B
    Page 2
    Page 3

    I was hoping to create a structure where I could get

    Page 1 | Page 2 | Page 3

    and a “submenu” under that would show the subpages in the same way underneath so clicking on Page 1 would give:

    Page 1 | Page 2 | Page 3
    Page A – Page B

    whereas the bottom line wouldn’t show on the other pages. Any hints? thanks again!

    3stripe

    (@3stripe)

    That sounds complicated! Try seaching for plugins to list child pages – something like http://jaredquinn.info/software/wordpress-plugin/sublist/ should help…

    opq

    (@opq)

    Thanks for the plugin! I gave it a try and it seems like it echos everything on those pages. How can I get it to not print out the content of all the other pages? I cant seem to get the syntax to work. Do you have an example? Thanks

    I tried adding this to the template but with no success:

    <?php subList('format="<a href="“%link%”" title="“%title%”">%title%</a> "', bool); ?>

    3stripe

    (@3stripe)

    This is what I use for my sub navigation:

    <?php /* Creates a menu for pages beneath the level of the current page */
    if (is_page() and ($notfound != '1')) {
    $current_page = $post->ID;
    while($current_page) {
    $page_query = $wpdb->get_row("SELECT ID, post_title, post_status, post_parent FROM $wpdb->posts WHERE ID = '$current_page'");
    $current_page = $page_query->post_parent;
    }
    $parent_id = $page_query->ID;
    $parent_title = $page_query->post_title;
    if ($wpdb->get_results("SELECT * FROM $wpdb->posts WHERE post_parent = '$parent_id' AND post_status != 'attachment'")) { ?>
    <ul>
    /* Remove the next line if you don't want to show the parent page
    <li><a href="<?php echo get_permalink($parent_id); ?>"><?php echo $parent_title; ?></a></li>
    <?php wp_list_pages('depth=1&sort_column=menu_order&title_li=&child_of='. $parent_id); ?>
    </ul>
    <?php } } ?>

    opq

    (@opq)

    Thanks so much! That’s just what I needed! Now how can I do a separate list that lists only the top navigation? I figured if I can do that then I can do exactly what I need!

    Oh yeah: I understand I can make changes CSS-ly by using #navmenu. What if I want two instances of the navigation? Where would I refer to a #navmenu2 for example in my theme code?

    opq

    (@opq)

    Okay so I got the CSS to work great. Thing is there’s a giant margin on the left. How do I override this?

    3stripe

    (@3stripe)

    “Now how can I do a separate list that lists only the top navigation?”

    You need to use wp_list_pages again, but with the depth parameter set to ‘1’ so it only shows the main pages… (http://codex.wordpress.org/Template_Tags/wp_list_pages)

    The margin on the left… you could try something like:

    #navmenu ul {
    list-style: none;
    text-indent: 0;
    padding: 0;
    margin: 0;
    }

    opq

    (@opq)

    Awesome! Yeah sorry I figured it out too but my reply must have not posted. Stupid IE 😛

    Thanks so much for the help!

    3stripe

    (@3stripe)

    No worries 🙂

    Yeah, it’s always good to post your solutions, even if it just means that other folks can see what you ended up doing!

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘Listing Pages In Custom Navigation without “List”s?’ is closed to new replies.