Help with wp_list_pages on horizontal menu bar

It’s all explained here… ??

https://codex.www.ads-software.com/Template_Tags/wp_list_pages

ok, I’ve got rid if the ‘pages’ bit, but I can’t see how to remove all the hardcoded ul and li stuff and insert a separator…

https://codex.www.ads-software.com/Template_Tags/wp_list_pages#Markup_and_styling_of_page_items

I have no idea how flexible it is, but again it is explained on that page…

I can’t see how to remove all the hardcoded ul and li stuff and insert a separator…

You don’t need to remove the list tags. Float the list items left, remove the default bullet on list items, and create a separator image to be used as a background for your list items.

– Tim

if you want an easy way to do this use the multi level navigation plugin
https://pixopoint.com/multi-level-navigation/

I am not sure about the “|” sign but it is horizontal and it doesn’t say “pages”

Thanks guys… I want to avoid plugins if at all possible. And if I’m honest, I’m old school – all this cross platform css stuff confuses the hell out of me lol. Give me table based layouts any day!

I wish I had the time to learn css all over again and try to understand css layouts, but sadly I don’t. And tbh I doubt any visitors will care how its coded as they are more interested in the content.

I’ll try to do more research on this though… and I appreciate your time and help ??

Using floats is just basic HTML/CSS….

The example on the page linked before was pretty straight-forward to.

If you get stuck, post back…

Thanks, I will do! ??

I haven’t done any html or css since 2003 and I wasn’t any good at div, floats and ul li ol stuff back then lol.

I’m looking at it now though ??

https://webdesign.about.com/od/advancedcss/a/aa010107.htm

Might help a little…

Float and clear makes more sense when you understand how they work…

Thanks for that mate, that’s a great place to start.

With kids running around my feet, I just don’t have the time or interest right now to learn everything required for cross browser compatibility. Things like this box model hack – https://webdesign.about.com/od/css/a/aaboxmodelhack.htm – and matching heights of 2 or 3 column divs, etc.

Thanks again though bud, I’m sure I’ll be back for more help soon lol ??

The following snippet in your template will output the desired effect:

<?php
$links = get_pages();

foreach($links as $i => $page)
	$links[$i] = '<li class="page-' . (is_page($page->ID) ? 'active' : 'item') . '"><a href="' . get_page_link($page->ID) . '" title="' . attribute_escape(apply_filters('the_title', $page->post_title)) . '">' . apply_filters('the_title', $page->post_title) . '</a></li>';

echo implode(' | ', $links);
?>

Hey guys – you said you were able to hide the title? How did you do that? THanks!

just remove the “Pages” text from the code.

I don’t understand. I just use this snippet and it pasts the navigation, with “Pages” included.
<?php wp_list_pages(); ?>

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