source: spip-zone/_squelettes_/escal/trunk/inclusions/inc-menuartH2.html @ 112840

Last change on this file since 112840 was 112840, checked in by root, 2 months ago

EscalV4 : proposition d'un 2e menu horizontal style "méga menu" full CSS

File size: 11.8 KB
Line 
1[(#REM) source : https://designmodo.com/create-css3-mega-menu/]
2
3<div class="menudesktop">
4<nav class="menu">
5<ul class="nav">
6
7[(#CONFIG{escal/config/taillelogorubmenu}|oui)
8#SET{taillelogo,#CONFIG{escal/config/taillelogorubmenu}}
9]
10[(#CONFIG{escal/config/taillelogorubmenu}|non)
11#SET{taillelogo,20}
12]
13
14
15        <li class="item-accueil">
16         <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_SITE_SPIP|parametre_url{lang,#ENV{lang}})],#URL_SITE_SPIP})]" title="<:escal:accueil:>">
17    [(#CONFIG{escal/config/logoaccueil}|=={oui}|oui)
18    [(#CHEMIN{images/accueil2.png}|balise_img{accueil,spip_logos}|image_reduire{0,#GET{taillelogo}})]
19    ]
20    [(#CONFIG{escal/config/texteaccueil}|=={non}|non)<:escal:accueil:>
21    ]
22    </a>
23        </li>
24
25        <!-- exclusion des rubriques avec le mot-clé "pas-au-menu" ou "invisible" et de ses sous-rubriques -->
26        <BOUCLE_exclure_rub_menu(RUBRIQUES){titre_mot IN 'pas-au-menu', 'invisible'}{doublons rubriques}>
27        <BOUCLE_exclure_ssrub_menu(RUBRIQUES){id_parent}{doublons rubriques}></BOUCLE_exclure_ssrub_menu>
28        </BOUCLE_exclure_rub_menu>
29
30        <!-- exclusion des articles avec le mot-clé "pas-au-menu" ou "invisible"  -->
31        <BOUCLE_exclure_art_menu(ARTICLES){titre_mot IN 'pas-au-menu', 'invisible'}{doublons articles}>
32        </BOUCLE_exclure_art_menu>
33
34
35 <!-- affichage des secteurs-->
36    <BOUCLE_secteur(RUBRIQUES){racine}{lang}{par num titre}{doublons rubriques}>
37     <li class="#EXPOSE rubrique rubrique#ID_RUBRIQUE secteur">
38     <a href="<INCLURE{fond=inclusions/inc-triurlrubrique}{id_rubrique}{env}>"[ class="(#EXPOSE)"] [title="(#DESCRIPTIF|textebrut|entites_html)"]>
39     [(#CONFIG{escal/config/logorubmenu}|=={oui}|oui)
40     [(#LOGO_RUBRIQUE|oui)[(#LOGO_RUBRIQUE|extraire_attribut{src}|balise_img{logo rubrique,spip_logos}|image_reduire{0,#GET{taillelogo}})]]
41     [(#LOGO_RUBRIQUE|non)[(#CHEMIN{images/transparent2.png}|balise_img{transparent,spip_logos menutransparent}|image_reduire{0,#GET{taillelogo}})] ]
42     ]
43     [(#CONFIG{escal/config/texterubmenu}|=={non}|non)
44     #TITRE
45     ]
46     </a>
47<div>
48<div class="nav-column">
49    <ul>
50       <!-- affichage des articles du secteur -->
51      <BOUCLE_testchrono(RUBRIQUES){id_rubrique}{titre_mot=chrono}>
52      <BOUCLE_articles_racineC(ARTICLES){id_rubrique} {par date}{inverse}{doublons articles}>
53        <li class="#EXPOSE article">
54         <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
55        </li>
56      </BOUCLE_articles_racineC>
57      </BOUCLE_testchrono>
58      <BOUCLE_articles_racine(ARTICLES){id_rubrique} {par num titre, titre}{doublons articles}>
59        <li class="#EXPOSE article">
60         <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
61        </li>
62      </BOUCLE_articles_racine>
63      <//B_testchrono>
64     
65      <!-- affichage des sous-rubriques de niveau 1 -->
66                        <BOUCLE_rubriques1(RUBRIQUES){id_parent}{par num titre, titre}{doublons rubriques}>
67        <li class="#EXPOSE rubrique">
68                                  <a href="<INCLURE{fond=inclusions/inc-triurlrubrique}{id_rubrique}{env}>"[ class="(#EXPOSE)"] [title="(#DESCRIPTIF|textebrut|entites_html)"]>[<h3>(#TITRE)</h3>]
69                                </a>
70        <ul>
71              <!-- affichage des articles des sous-rubriques de niveau 1 -->
72              <BOUCLE_testchrono1(RUBRIQUES){id_rubrique}{titre_mot=chrono}>
73              <BOUCLE_articles_rubrique1C(ARTICLES){id_rubrique} {par date}{inverse}{doublons articles}>
74                <li class="#EXPOSE article">
75                  <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
76                </li>
77              </BOUCLE_articles_rubrique1C>
78              </BOUCLE_testchrono1>
79              <BOUCLE_articles_rubrique1(ARTICLES){id_rubrique} {par num titre, titre}{doublons articles}>
80                <li class="#EXPOSE article">
81                  <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
82                </li>
83              </BOUCLE_articles_rubrique1>
84              <//B_testchrono1>
85             
86              <!-- affichage des sous-rubriques de niveau 2 -->
87              <BOUCLE_rubriques2(RUBRIQUES){id_parent}{par num titre, titre}{doublons rubriques}>
88                <li class="#EXPOSE rubrique">
89                                  <a href="<INCLURE{fond=inclusions/inc-triurlrubrique}{id_rubrique}{env}>"[ class="(#EXPOSE)"] [title="(#DESCRIPTIF|textebrut|entites_html)"]>[(#TITRE)]
90                                                </a>
91
92                                      <ul>
93                      <!-- affichage des articles des sous-rubriques de niveau 2 -->
94                      <BOUCLE_testchrono2(RUBRIQUES){id_rubrique}{titre_mot=chrono}>
95                      <BOUCLE_articles_rubrique2C(ARTICLES){id_rubrique} {par date}{inverse}{doublons articles}>
96                        <li class="#EXPOSE article">
97                          <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
98                        </li>
99                      </BOUCLE_articles_rubrique2C>
100                      </BOUCLE_testchrono2>
101                      <BOUCLE_articles_rubrique2(ARTICLES){id_rubrique} {par num titre, titre}{doublons articles}>
102                        <li class="#EXPOSE article">
103                          <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
104                        </li>
105                      </BOUCLE_articles_rubrique2>
106                      <//B_testchrono2>
107                     
108                      <!-- affichage des sous-rubriques de niveau 3 -->
109                      <BOUCLE_rubriques3(RUBRIQUES){id_parent}{par num titre, titre}{doublons rubriques}>
110                      <li class="#EXPOSE rubrique">
111                                          <a href="<INCLURE{fond=inclusions/inc-triurlrubrique}{id_rubrique}{env}>"[ class="(#EXPOSE)"] [title="(#DESCRIPTIF|textebrut|entites_html)"]>[(#TITRE)]
112                                                        </a>
113
114                                            <ul>
115                            <!-- affichage des articles des sous-rubriques de niveau 3 -->
116                            <BOUCLE_testchrono3(RUBRIQUES){id_rubrique}{titre_mot=chrono}>
117                            <BOUCLE_articles_rubrique3C(ARTICLES){id_rubrique} {par date}{inverse}{doublons articles}>
118                              <li class="#EXPOSE article">
119                                <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
120                            </li>
121                            </BOUCLE_articles_rubrique3C>
122                            </BOUCLE_testchrono3>
123                            <BOUCLE_articles_rubrique3(ARTICLES){id_rubrique} {par num titre, titre}{doublons articles}>
124                              <li class="#EXPOSE article">
125                                <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
126                            </li>
127                            </BOUCLE_articles_rubrique3>
128                            <//B_testchrono3>
129                           
130                            <!-- affichage des sous-rubriques de niveau 4 -->
131                            <BOUCLE_rubriques4(RUBRIQUES){id_parent}{par num titre, titre}{doublons rubriques}>
132                            <li class="#EXPOSE rubrique">
133                                                  <a href="<INCLURE{fond=inclusions/inc-triurlrubrique}{id_rubrique}{env}>"[ class="(#EXPOSE)"] [title="(#DESCRIPTIF|textebrut|entites_html)"]>[(#TITRE)]
134                                                                </a>
135
136                                                    <ul>
137                                  <!-- affichage des articles des sous-rubriques de niveau 4 -->
138                                  <BOUCLE_testchrono4(RUBRIQUES){id_rubrique}{titre_mot=chrono}>
139                                  <BOUCLE_articles_rubrique4C(ARTICLES){id_rubrique} {par date}{inverse}{doublons articles}>
140                                    <li class="#EXPOSE article">
141                                      <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
142                                    </li>
143                                  </BOUCLE_articles_rubrique4C>
144                                  </BOUCLE_testchrono4>
145                                  <BOUCLE_articles_rubrique4(ARTICLES){id_rubrique} {par num titre, titre}{doublons articles}>
146                                    <li class="#EXPOSE article">
147                                      <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
148                                    </li>
149                                  </BOUCLE_articles_rubrique4>
150                                  <//B_testchrono4>
151
152                                  <!-- affichage des sous-rubriques de niveau 5 -->
153                                  <BOUCLE_rubriques5(RUBRIQUES){id_parent}{par num titre, titre}{doublons rubriques}>
154                                  <li class="#EXPOSE rubrique">
155                                                          <a href="<INCLURE{fond=inclusions/inc-triurlrubrique}{id_rubrique}{env}>"[ class="(#EXPOSE)"] [title="(#DESCRIPTIF|textebrut|entites_html)"]>[(#TITRE)]
156                                                                        </a>
157
158                                                            <ul>
159                                        <!-- affichage des articles des sous-rubriques de niveau 5 -->
160                                        <BOUCLE_testchrono5(RUBRIQUES){id_rubrique}{titre_mot=chrono}>
161                                        <BOUCLE_articles_rubrique5C(ARTICLES){id_rubrique} {par date}{inverse}{doublons articles}>
162                                          <li class="#EXPOSE article">
163                                            <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
164                                          </li>
165                                        </BOUCLE_articles_rubrique5C>
166                                        </BOUCLE_testchrono5>
167                                        <BOUCLE_articles_rubrique5(ARTICLES){id_rubrique} {par num titre, titre}{doublons articles}>
168                                          <li class="#EXPOSE article">
169                                            <a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})],#URL_ARTICLE})]" title="[(#DESCRIPTIF|textebrut|entites_html)]">[(#TITRE)]</a>
170                                          </li>
171                                        </BOUCLE_articles_rubrique5>
172                                        <//B_testchrono5>
173                                                                  </ul>
174
175                                  </li>
176                                 </BOUCLE_rubriques5>
177                                                    </ul>
178
179                            </li>
180                           </BOUCLE_rubriques4>
181                                            </ul>
182
183                                  </li>
184                                </BOUCLE_rubriques3>
185                                </ul>
186              </li>
187             </BOUCLE_rubriques2>
188                                    </ul>
189
190                          </li>
191                        </BOUCLE_rubriques1>
192    </ul>
193</div>
194</div>
195     </li>
196        </BOUCLE_secteur>
197</ul><!-- fin menu -->
198</nav>
199</div>
Note: See TracBrowser for help on using the repository browser.