Adding a delimiter between menu itemes

[Mild Fuzz]

Using wp_list_pages() to create a menu, I am sure there should be an easy way to add a pipe ( '|' ) between pages, can't seem to find any info it.

Cheers

[chipbennett]

Using wp_list_pages() to create a menu, I am sure there should be an easy way to add a pipe ( '|' ) between pages, can't seem to find any info it.

Cheers

wp_list_pages() returns results wrapped inside LI tags.

There's no way to tell the function to put any text between list items. But, you can very easily use CSS to style both the list (UL) and the list items (LI).

By default, the function wraps everything in a UL class="pagenav", and assigns class="page-item" to each of the LIs.

So, you could approximate a pipe between list items by styling the right/left border property for LI.page-item.

See here for more information.

[Mild Fuzz]

So, you could approximate a pipe between list items by styling the right/left border property for LI.page-item.

That's what I am doing, but I thought should such functionality exist, it would be useful to know.

It seems to me that such an argument would be a welcome addition to wp_list_pages

[chipbennett]

That's what I am doing, but I thought should such functionality exist, it would be useful to know.

It seems to me that such an argument would be a welcome addition to wp_list_pages

Perhaps, but only if the function returned something other than an unordered list, wrapped in LI tags. As it is, putting something between the closing LI tag of one list item and the opening LI tag of the next list item wouldn't be valid HTML.

You could use the text_before or text_after parameters, but they place text inside the link (A) tags, and I'm sure that wouldn't be what you're after.

[Mild Fuzz]

Perhaps, but only if the function returned something other than an unordered list, wrapped in LI tags. As it is, putting something between the closing LI tag of one list item and the opening LI tag of the next list item wouldn't be valid HTML.

You could use the text_before or text_after parameters, but they place text inside the link (A) tags, and I'm sure that wouldn't be what you're after.

As you code the corresponding <ul> tags seperately, it would logical to make the <li> tags optional also?

[chipbennett]

As you code the corresponding <ul> tags seperately, it would logical to make the <li> tags optional also?

Well, it is called wp_list_pages() for a reason. :)

[Ryan]

You can filter the wp_list_pages() function, so you could replace those <li> tags with anything you want.

The following should (unless I screwed something up - which is highly likely) replace the wp_list_pages() function with a string of text:

<?php
function random_filter() {
	$newlist= 'I replaced the wp_list_pages() function with this random bit of text';
	return $newlist;
}
 
add_filter( 'wp_list_pages', 'random_filter' );
?>

[Ryan]

The example I gave above isn't quite so useful to what you are doing. The following might be more useful since it should make use of the existing data:

<?php
function random_filter( $args ) {
	$args = $args . 'I add this to the regular list';
	return $args;
}
 
add_filter( 'wp_list_pages', 'random_filter' );
?>

I don't need filters very often (at all?) so it's entirely possible these don't work. If they don't work, just lemme and I'll figure out how they should work.

[Ryan]

Sorry for the triple post ...

To achieve the effect you are looking for, I usually apply a right hand border to the links. This gives the visual effect without having to modify the markup. It's rare that you would ever want anything but a list for a list of pages anyway. I use the last-child pseudo class to prevent it from displaying on the last list item, this obviously doesn't work in some browsers, but I don't worry about that these days since it's not exactly a mission critical part of the site.

[Otto]

It'd probably be simpler to just write your own code.

1. Call get_pages to get a list of pages.
2. Go through those pages with a foreach, and build the links to each page. Put them in an array.
3. Use implode to turn that array into a string with your delimiters.