Navigation Menu - Custom Links

[Dean]

Hi all

I have successfully built my very first navigation menu. It works by looping through the pages within a section and echoing the page title and url. The problem is, sometimes I will need a navigation link to take me to a page within a different section to the current one, and I have no idea how I could achieve this. Has anyone ever had to do this themselves, or have an idea how it could be achieved?

[Craig]

I would create a new template with Page field which could be used for those pages.

For example:

New template: link

Fields: title, link

New field: link

Type: Page

Input: PageListSelect

When creating custom page links in your page tree, just use the "link" field to browse to the destination page. You will then be able to access the destination page in the code:

<?php
$children = wire('pages')->children();

foreach ($children as $child) {
    $url = $child->url;
    $title = $child->title;

    if ($child->template->name == 'link' && $child->link->id) {
        // Access the "link" field on the child page to get the destination page.
        $url = $child->link->url;
        // Optional: use the linked page's title? You decide!
        $title = $child->link->title;
    }

    echo "<a href='$url'>$title</a>";
}
?>

Using this method, you could even add a URL text field to the template if you wanted to link to places offsite as well.

[Dean]

Craig, thanks for this. I think I understand what you mean, but would this only allow me to add one 'other' link to my page? Or I am not getting it?

Ideally, I would need to be able to have a menu like:

<child page of this section>

<child page of this section>

<link to another page in the site>

<child page of this section>

<link to another page in the site>

<child page of this section>

[Raymond Geerts]

When its not of any concern that the navigation will be 'static' you could use a field of the type Page which contains a list of the pages you need to list.

Create a new field called navigation of the type Page, make sure it can contain multiple pages and select the Homepage as parent.

Then attach this field to the Home template.

Next thing to do is add all the pages you want to list in the navigation and sort them the way you like.

Then in your code you can loop trough them as follow:

$navigation = $pages->get('/')->navigation;

foreach($navigation as $item) {
  // your html for the menu
}

[Craig]

Craig, thanks for this. I think I understand what you mean, but would this only allow me to add one 'other' link to my page? Or I am not getting it?

Ideally, I would need to be able to have a menu like:

<child page of this section> (template: basic-page)

<child page of this section> (template: basic-page)

<link to another page in the site> (template: link)

<child page of this section> (template: basic-page)

<link to another page in the site> (template: link)

<child page of this section> (template: basic-page)

Nope, you could definitely do that. I've added some detail to your example above, does that help?

Just add a new "link" page (using the link template) for each additional page you want to link to in the menu. Each link page will give you the option of specifying which site page to link to using the "link" Page fieldtype.

[Dean]

Thanks Craig, Raymond. I will try these options and see which works best for me.