1,122
edits
NeilThomas (talk | contribs) |
|||
Line 25: | Line 25: | ||
=== Adding new pages to the new site menus === | === Adding new pages to the new site menus === | ||
Unlike the old site where you had the edit the menu on every existing page in order to add a new one, the new site has the menus defined once. | Unlike the old site where you had the edit the menu on every existing page in order to add a new one, the new site has the menus defined once. | ||
You will find | You will find it in the /js/menu.js file defined as a single object. | ||
Here is the full menu... | Here is the full menu... | ||
<nowiki> | <nowiki> | ||
menuSrc = [ | |||
{title: "Now", menu: "b", url: "index.htm"}, | |||
{title: "Today", menu: "b", url: "today.htm"}, | |||
{title: "Yesterday", menu: "b", url: "yesterday.htm"}, | |||
{title: "Gauges", menu: "b", url: "gauges.htm"}, | |||
{title: "Records", menu: "b", submenu: true, items: [ | |||
{title: "This Month", menu: "b", url: "thismonth.htm"}, | |||
{title: "This Year", menu: "b", url: "thisyear.htm"}, | |||
{title: "All Time", menu: "b", url: "record.htm"}, | |||
{title: "Monthly", menu: "b", url: "monthlyrecord.htm"} | |||
]}, | |||
{title: "Charts", menu: "b", submenu: true, items: [ | |||
{title: "Trends", menu: "b", url: "trends.htm"}, | |||
{title: "Select-a-graph", menu: "b", url: "selectachart.htm"}, | |||
{title: "Historic", menu: "b", url: "historic.htm"} | |||
]}, | |||
{title: "Reports", menu: "b", url: "noaareport.htm"}, | |||
{title: "Forum", menu: "b", url: "#", forum: true, new_window: true}, | |||
{title: "Webcam", menu: "b", url: "#", webcam: true} | |||
]; | |||
</nowiki> | |||
You can see each page is defined in this format... | You can see each page is defined in this format... | ||
<nowiki> | <nowiki> | ||
{title: "Now", menu: "b", url: "index.htm"},</nowiki> | |||
Where: | |||
You can just add to this | title = the text that appears on the menu | ||
menu = b - appears on both the full and mobile menus, w - show on full (wide) menu only, n - show on mobile (narrow) menu only | |||
You can just add new items to this object, and the new menu item will then appear on every page. So to add a Custom page add this... | |||
<nowiki> | <nowiki> | ||
{title: "Custom", menu: "b", url: "custom.htm"},</nowiki> | |||
</nowiki> | |||
So it becomes... | So it becomes... | ||
<nowiki> | <nowiki> | ||
{title: "Now", menu: "b", url: "index.htm"}, | |||
{title: "Today", menu: "b", url: "today.htm"}, | |||
{title: "Custom", menu: "b", url: "custom.htm"}, | |||
{title: "Yesterday", menu: "b", url: "yesterday.htm"}, | |||
{title: "Gauges", menu: "b", url: "gauges.htm"}, | |||
{title: "Records", menu: "b", submenu: true, items: [ | |||
{title: "This Month", menu: "b", url: "thismonth.htm"}, | |||
{title: "This Year", menu: "b", url: "thisyear.htm"}, | |||
{title: "All Time", menu: "b", url: "record.htm"}, | |||
{title: "Monthly", menu: "b", url: "monthlyrecord.htm"} | |||
]}, | |||
{title: "Charts", menu: "b", submenu: true, items: [ | |||
{title: "Trends", menu: "b", url: "trends.htm"}, | |||
{title: "Select-a-graph", menu: "b", url: "selectachart.htm"}, | |||
{title: "Historic", menu: "b", url: "historic.htm"} | |||
]}, | |||
{title: "Reports", menu: "b", url: "noaareport.htm"}, | |||
{title: "Forum", menu: "b", url: "#", forum: true, new_window: true}, | |||
{title: "Webcam", menu: "b", url: "#", webcam: true} | |||
</nowiki> | </nowiki> | ||
Where I have inserted the new | Where I have inserted the new Custom page between "Now" and "Yesterday" | ||
Submenus can also be defined, they use the property "submenu: true", and then have an array of submenu items (defined as above) added to the "items: []" array. | |||
You will also find an example extended menu called "menuSample.js" in the webfiles/js folder. | |||
Note: the forum and webcam menu items only have special properties "forum" and "webcam", these are used by the main page code to determine if these menu items should be displayed or not. | |||
=== Making changes to the pages=== | === Making changes to the pages=== | ||
Although looking at the new template pages makes the idea of editing them daunting, it really is not that hard. There are just a few classes that are really useful. | Although looking at the new template pages makes the idea of editing them daunting, it really is not that hard. There are just a few classes that are really useful. |