Correct route names in Twig examples

docs/book/v1/how-tos/edit-footer.md

@@ -66,7 +66,7 @@ It also contains the copyright row.
 
         <div class="row">
             <p class="footer-headline">
-                © {{ 'now' | date('Y') }} by <a href="{{ url('home') }}">My Project</a>
+                © {{ 'now' | date('Y') }} by <a href="{{ url('app::index') }}">My Project</a>
             </p>
         </div>
     </div>

docs/book/v1/how-tos/edit-top-menu.md

@@ -11,12 +11,12 @@ You can use the below as an example.
       <li class="nav-item dropdown">
         <a class="nav-link dropdown-toggle" href="#" id="pageDropdown" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Grouped Pages</a>
         <div class="dropdown-menu" aria-labelledby="pageDropdown">
-          <a class="dropdown-item" href="{{ url('page', {action: 'home'}) }}">Home</a>
+          <a class="dropdown-item" href="{{ url('app::index') }}">Home</a>
           <a class="dropdown-item" href="https://www.example.com/docs">Docs</a>
         </div>
       </li>
       <li class="nav-item">
-          <a class="nav-link" target="_blank" href="{{ url('page', {action: 'firstLink'}) }}">First Link</a>
+          <a class="nav-link" target="_blank" href="{{ url('page::about') }}">First Link</a>
       </li>
       <li class="nav-item">
           <a class="nav-link" target="_blank" href="https://second.example.com/">Second Link</a>
@@ -27,6 +27,9 @@ You can use the below as an example.
 
 Each `li` element is listed as an item in the top menu.
 
+Internal links are generated with the `url()` helper, which takes a route name and returns an absolute URL.
+Route names follow the `{prefix}::{template}` pattern described in [Routing](routing.md), so the pages shipped with Light are reachable as `page::about` and `page::who-we-are`, and the homepage as `app::index`.
+
 There are two different types of elements in the example:
 
 - The `Grouped Pages` group several urls.

docs/book/v1/how-tos/twitter-opengraph-cards.md

@@ -10,19 +10,20 @@ Make sure to update all items based on your page content.
 <meta name="twitter:site" content="@example">
 <meta name="twitter:title" content="Page title">
 <meta name="twitter:description" content="Basic description">
-<meta name="twitter:image" content="{{ url('home') }}images/app/My-image.png">
+<meta name="twitter:image" content="{{ absolute_url(asset('images/app/My-image.png')) }}">
 <meta name="twitter:image:alt" content="Image alt">
 
 <!-- OpenGraph card -->
 <meta property="og:title" content="Page title"/>
 <meta property="og:type" content="website"/>
-<meta property="og:url" content="{{ url('home') }}"/>
-<meta property="og:image" content="{{ url('home') }}images/app/My-image.png"/>
+<meta property="og:url" content="{{ url('app::index') }}"/>
+<meta property="og:image" content="{{ absolute_url(asset('images/app/My-image.png')) }}"/>
 <meta property="og:description" content="Basic description"/>
 ```
 
 In the example:
 
-- {{ url('home') }} is the URL for the homepage, but you can also use this code to generate the url for other pages, just like in the canonical URL `{% block canonical %}{{ url(routeName ?? null) }}{% endblock %}`.
+- `{{ url('app::index') }}` is the absolute URL of the homepage, and `url()` returns an absolute URL for any route name, which is what cards require — you can point a card at another page the same way, just like the canonical URL does in `{% block canonical %}{{ url(routeName ?? null) }}{% endblock %}`.
     - The `block` item is present to mitigate for not-found pages, e.g. when the url is typed incorrectly.
-- The image from `{{ url('home') }}images/app/My-image.png` is found in `public/images/app/PHP-REST-API.png`, but it is copied there by the `npm` script from `src/App/assets/images/PHP-REST-API.png`.
+- Card images must be absolute URLs too, but `asset()` on its own returns a path, so it is wrapped in `absolute_url()`.
+The image from `{{ absolute_url(asset('images/app/My-image.png')) }}` is found in `public/images/app/PHP-REST-API.png`, but it is copied there by the `npm` script from `src/App/assets/images/PHP-REST-API.png`.