diff --git a/11-page-menu.md b/11-page-menu.md index 48ff549..5e1f7e4 100644 --- a/11-page-menu.md +++ b/11-page-menu.md @@ -80,6 +80,44 @@ At the top of your `Homepage.html` file add this code: Now if you refresh the homepage in the browser, you should see a link. +The menu works on the homepage, but we want it on all our pages. We could copy it over to all the template files, but that would be a bad idea. Then if something changes, you would have to go change all the files. + +So instead we are going to use a layout that can be used by all the templates. + +Create a `Layout.html` in your `templates` folder with the following content: + +```php +{% for item in menuItems %} + {{ item['text'] }}
+{% endfor %} +
+{% block content %} +{% endblock %} +``` + +Then change your `Homepage.html` to this: + +```php +{% extends "Layout.html" %} +{% block content %} +

Hello World

+ Hello {{ name }} +{% endblock %} +``` + +And your `Page.html` to this: + +```php +{% extends "Layout.html" %} +{% block content %} + {{ content }} +{% endblock %} +``` + +If you refresh your homepage now, you should see the menu. But if you go to a subpage, the menu is not there but the `
` line is. + +The problem is that we are only passing the `menuItems` to the homepage. Doing that over and over again for all pages would be a bit tedious and a lot of work if something changes. So let's fix that in the next step. + to be continued... [<< previous](10-dynamic-pages.md) \ No newline at end of file