1 |
# mognase - mageia.org global navigation service |
2 |
|
3 |
This service is available so that each mageia.org Web service/site can have |
4 |
a same, consistent looking, synchronized navigation bar. |
5 |
|
6 |
You have two ways to use this service: |
7 |
|
8 |
* using a Javascript snippet; |
9 |
* using directly CSS and HTML and placing them at the right place. |
10 |
|
11 |
|
12 |
## Use a Javascript snippet (preferred, less work) |
13 |
|
14 |
Place this at the end of your HTML document: |
15 |
|
16 |
> ```<script src="//nav.mageia.org/js/"></script> |
17 |
> ``` |
18 |
|
19 |
It will: |
20 |
|
21 |
* load the stylesheet rules |
22 |
* detect some of your document features; |
23 |
* build a ```<div id="nav" />``` node just after the ```<body>``` of your doc; |
24 |
* call and inject the HTML. |
25 |
|
26 |
|
27 |
## Use directly HTML & CSS |
28 |
|
29 |
Get, and _cache_ those two document and insert them in your HTML. |
30 |
|
31 |
* ```//nav.mageia.org/css/``` |
32 |
* ```//nav.mageia.org/html/?l={html[lang]}&b={body[class]}&w=1``` |
33 |
|
34 |
and: |
35 |
|
36 |
* publish CSS in your documents. |
37 |
* put HTML in ```<div id="nav" />``` just after the ```<body>``` |
38 |
of your doc |
39 |
|
40 |
---- |
41 |
|
42 |
## Update your documents HTML & CSS |
43 |
|
44 |
In both cases, you need to change your CSS rules so that they match: |
45 |
|
46 |
> ``` |
47 |
> html, body { margin: 0; padding: 0; } |
48 |
> ``` |
49 |
|
50 |
If you want to see the navigation bar sections activated for your site/app, |
51 |
you need to update your documents' body[class] too, to match either: |
52 |
|
53 |
* ```map``` (global "home" element, mageia logo) |
54 |
* ```about``` (about section) |
55 |
* ```downloads``` (downloads & products section) |
56 |
* ```community``` (community tools & resources section) |
57 |
* ```support``` (support section) |
58 |
* ```contribute``` (contributors section) |
59 |
* ```you``` (identity, personal data & services) |
60 |
|
61 |
Finally, to have an integrated h1 title with the top navigation, put it just |
62 |
at the top of your HTML document: |
63 |
|
64 |
> ```<body> |
65 |
> <h1 id="mgnavt">your title</h1>``` |
66 |
|
67 |
|
68 |
## Features |
69 |
|
70 |
The detected and used features are: |
71 |
|
72 |
* ```html[lang]``` is used to translate the menu in the said language, |
73 |
when available |
74 |
* ```body[class]``` is not used yet. |
75 |
* ```head > meta[name="context"] value``` is not used yet. |
76 |
* ```document.location.href``` is used for stats purpose (logs). |
77 |
|
78 |
|
79 |
|
80 |
## Code & license |
81 |
|
82 |
* code is in [svn://svn.mageia.org/svn/web/nav/](http://svn.mageia.org/web/nav/) |
83 |
* licensed under GNU GPL-3+, 2012, rda |
84 |
* patches and discussions welcome in [Mageia Web team](https://wiki.mageia.org/en/Web_team) |
85 |
|
86 |
---- |