WordPress.org

Ready to get started?Download WordPress

Forums

Odd question: separator for a list generated by wp_list_pages (7 posts)

  1. Elan42.com
    Member
    Posted 6 years ago #

    Hu guys... I have a question that seems a dumb one but it isn't...

    I have to generate a menu with a nice separator, like:
    page1 - page2 - page3

    The problem css-ing a wp_list_pages menu is that i can only do this:
    - page1 - page2 - page3
    using the list elements or this:
    page1 | page2 | page3 |
    using a table border like border-right.

    But I need to have a separator element only in the middle.

    Is there any solution?

  2. iridiax
    Member
    Posted 6 years ago #

    You can do this using css with the first-child pseudo-class so that the first element is styled differently.

  3. Monika
    Member
    Posted 6 years ago #

    IE 6 can't understand but browser do
    .navi li+li {border-left:1px solid #ffa500;}

    or

    li+li{border-left:1px solid #ffa500;}

    regards

    Monika

  4. Elan42.com
    Member
    Posted 6 years ago #

    Thank you very much, I'll try ASAP.

  5. Elan42.com
    Member
    Posted 6 years ago #

    This solution works partially.

    It's impossible to use it if you want the current-page-item to be hidden, and it doesn't works on all the browsers.

    Is there any plugin to generate a menu with a simple separator between the elements?

    Otherwise, I will be obligated to crack WordPress code myself... that's stupid.

  6. fedmich
    Member
    Posted 5 years ago #

    Have similar problem right now. and a bit surprised that I cant find solution on the internet using just php code.

    Here's the solution I made in case you still haven't found the solution.

    <?php
    $sep = '|';
    	$spages = wp_list_pages('sort_column=menu_order&depth=1&echo=0');
    	preg_match_all('@<a href="(?<a>.*?)">(?<t>.*?)</a>@', $spages, $out);
    	$cnt_pages = count($out['a']);
    	for($i=0;$i<=$cnt_pages;++$i){
    		echo $out['t'][$i];
    		if($i<$cnt_pages-1){
    			echo $sep;
    		}
    	}
    ?>
  7. Capn Code
    Member
    Posted 5 years ago #

    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);
    ?>

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.