WordPress wp_list_pages - Change children of parent from URLS into #anchor links

Viewed 76

I'm setting up a side navigation menu using wp_list_pages and I would like to convert the children links from URLs into anchor links i.e #link rather than the current https://example.com/link being generated by wp_list_pages .

I was attempting to use the following code:

<?php
    $my_pages = wp_list_pages('echo=0&title_li=&child_of=5&depth=1');

    $pieces = explode('"', $my_pages);
    $i = 5;

    $j = 3;
    $limit = count($pieces);

    for (;$i<$limit;) {
        $tmp1 = '#'.$pieces[$j];

        $pieces[$i] = $tmp1;
        $i = $i+6;

        $j = $j+6;
    }
    $tmp2 = implode('"',$pieces);

    echo $tmp2;
?>

But it seems to be very old and I can't wrap my head around how to properly implement it into my current structure. Maybe this code is useless for what I'm trying to do but I couldn't find anything that would work.

This is what I have currently:

<div class="hero-container">

          <?php
          global $children;
          global $post;
          if ( $post->post_parent ) {
            $children = wp_list_pages( array(
              'title_li' => '',
              'child_of' => $post->post_parent,
              'echo'     => 0
            ) );
             } else {
            $children = wp_list_pages( array(
              'title_li' => '',
              'child_of' => $post->ID,
              'echo'     => 0
              ) );
            }
            if ( $children ) : ?>

          <?php echo '<div class="hero-side-menu">', '<h1>', get_the_title(), '</h1>', '<ul>', $children, '</ul>', '</div>' ?>

         <?php endif; ?>
  </div>

Any suggestions would be very much appreciated as I've been trying to figure this out for a few days and have gotten nowhere... also would appreciate an explanation as I'm trying to learn where I went wrong!

I need to modify the children of the parent pages to have #anchor links rather than URLS as I've condensed the pages into their parents but still wish to have them as options within the side menu.

Clarification: I have a page with children pages that I referred to as parents however, they are indeed children. I would like to keep the URLS for the children pages and then make the children of the children #links.

1 Answers

This depends a bit on what you want the anchor text to be. Whether it's an ID or a title, etc. But you can modify that to your need.

You may want to try get_pages() instead, so you have a little more control over the output. Something like the following:

<div class="hero-container">

  <?php        
  global $post;

  $current_page_title = $post->post_title; // current page title

  $child_pages = 
      get_pages(
        array(
         'child_of' => $post->ID       
        ),
      );

  if ($child_pages) : ?>

    <div class="hero-side-menu">
      <h1><?php echo $current_page_title; ?></h1>

      <ul>

       <?php foreach ($child_pages as $page) : ?>

          <li><a href="<?php echo '#' . $page->post_title; ?>"><?php echo $page->post_title; ?></a></li>

       <?php endforeach; ?>

      </ul>

    </div>

  <?php endif; ?>

</div>
Related