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 |
1. using a Javascript snippet; |
9 |
1. using directly CSS and HTML and placing them at the right place. |
10 |
|
11 |
--- |
12 |
## 1. 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 |
## 2. 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 |
## Update your documents HTML & CSS |
42 |
|
43 |
In both cases, you need to change your CSS rules so that they match: |
44 |
|
45 |
> ``` |
46 |
> html, body { margin: 0; padding: 0; } |
47 |
> ``` |
48 |
|
49 |
If you want to see the navigation bar sections activated for your site/app, |
50 |
you need to update your documents' body[class] too, to match either: |
51 |
|
52 |
* ```map``` (global "home" element, mageia logo) |
53 |
* ```about``` (about section) |
54 |
* ```downloads``` (downloads & products section) |
55 |
* ```community``` (community tools & resources section) |
56 |
* ```support``` (support section) |
57 |
* ```contribute``` (contributors section) |
58 |
* ```you``` (identity, personal data & services) |
59 |
|
60 |
Finally, to have an integrated h1 title with the top navigation, put it just |
61 |
at the top of your HTML document: |
62 |
|
63 |
> ```<body> |
64 |
> <h1 id="mgnavt">your title</h1>``` |
65 |
|
66 |
--- |
67 |
## Features |
68 |
|
69 |
The detected and used features are: |
70 |
|
71 |
* ```html[lang]``` is used to translate the menu in the said language, |
72 |
when available |
73 |
* ```body[class]``` is not used yet. |
74 |
* ```head > meta[name="context"] value``` is not used yet. |
75 |
* ```document.location.href``` is used for stats purpose (logs). |
76 |
|
77 |
--- |
78 |
## Code & license |
79 |
|
80 |
* code is in [svn://svn.mageia.org/svn/web/nav/](http://svn.mageia.org/web/nav/) |
81 |
* licensed under GNU GPL-2+, 2012, rda |
82 |
* issues on [bugs.mageia.org](https://bugs.mageia.org/buglist.cgi?query_format=advanced&bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&component=nav.mageia.org&product=Websites) |
83 |
* patches and discussions welcome in [Mageia Web team](https://wiki.mageia.org/en/Web_team) |
84 |
|
85 |
--- |
86 |
## TODO |
87 |
|
88 |
* [FIXED, 2012/06/11] no cache on the service (speeding up delivery) |
89 |
* [PARTIAL] jumping page when the bar is loaded: |
90 |
- fixed for: forum, wiki/Vector; |
91 |
- the bar still slides, but the page is already at the right place, with a fixed position from top; quick example: |
92 |
|
93 |
html, body { margin: 0; padding: 0; } |
94 |
#wrap { margin-top: 80px; } |
95 |
#hmgn { position: absolute; top: 0; left: 0; width: 100%; } |
96 |
|
97 |
* navbar still to deploy on: planet, mailing-lists |
98 |
* needs some work: blog, wiki (switch to Vector) |
99 |
* nav bar won't fix/resize depending on screen resolution => use CSS media queries |
100 |
* no cache wrapper/library available for client apps |
101 |
* [?] nav bar design and branding ugly |
102 |
* [?] nav bar too big |
103 |
|
104 |
* analytics for forum |
105 |
|
106 |
* wiki media queries |
107 |
|
108 |
### Issues |
109 |
|
110 |
* [WONTFIX] when using the JS service, no fallback for browsers with no Javascript |
111 |
* |
112 |
|
113 |
---- |