PluXml | Afficher les catégories sous forme de menus
Rédigé par O. Clotaire
2 commentaires
Classé dans : PluXml
Voilà quelques méthodes que j'ai trouvé ici et là sur le Net qui permettent d'afficher les une ou plusieurs catégories dans le menu fixe de PluXml.
Le fichier php à modifier pour le(s) menu(s) est /themes/defaut/header.php
Le menu déroulant :
<?php $plxShow->staticList($plxShow->getLang('HOME'),'<li class="#static_status" id="#static_id"><a href="#static_url" title="#static_name">#static_name</a></li>'); ?>
<li class="submenus">
<a href="#"><?php $plxShow->lang('CATEGORIES') ?> ▼</a>
<ul>
<?php $plxShow->catList('','<li id="#cat_id"><a class="#cat_status" href="#cat_url" title="#cat_name">#cat_name</a> (#art_nb)</li>'); ?>
</ul>
</li>
<?php $plxShow->pageBlog('<li id="#page_id"><a class="#page_status" href="#page_url" title="#page_name">#page_name</a></li>'); ?>
<?php $plxShow->staticList($plxShow->getLang('HOME'),'<li class="#static_status" id="#static_id"><a href="#static_url" title="#static_name">#static_name</a></li>'); ?>
<li class="submenus">
<a href="#"><?php $plxShow->lang('CATEGORIES') ?> ▼</a>
<ul>
<?php $plxShow->catList('','<li id="#cat_id"><a class="#cat_status" href="#cat_url" title="#cat_name">#cat_name</a> (#art_nb)</li>'); ?>
</ul>
</li>
<?php $plxShow->pageBlog('<li id="#page_id"><a class="#page_status" href="#page_url" title="#page_name">#page_name</a></li>'); ?>
Et pour la feuille de style du menu déroulant, le fichier est /themes/defaut/css/theme.css :
/* -------- Sous menu articles --------- */
.submenus ul {
position: relative;
left: -9999px;
float: left;
margin: 0;
padding: 0;
list-style: none;
z-index: 999;
}
.submenus:hover ul {
left: 0;
color: #fff;
background-color:#000;
}
.submenus:hover ul li {
font-size: 0.9rem;
clear: both;
float: left;
padding: 2px 10px 2px 10px;
width: 100%;
}
.submenus:hover ul li a {
display: inline-block;
margin: 0;
padding: 3px 0 3px 0;
}
.submenus:hover ul li a:hover {
text-decoration: none;
}
/* -------- Sous menu articles --------- */
.submenus ul {
position: relative;
left: -9999px;
float: left;
margin: 0;
padding: 0;
list-style: none;
z-index: 999;
}
.submenus:hover ul {
left: 0;
color: #fff;
background-color:#000;
}
.submenus:hover ul li {
font-size: 0.9rem;
clear: both;
float: left;
padding: 2px 10px 2px 10px;
width: 100%;
}
.submenus:hover ul li a {
display: inline-block;
margin: 0;
padding: 3px 0 3px 0;
}
.submenus:hover ul li a:hover {
text-decoration: none;
}
Sera visible sous la forme :
Accueil | Catégorie 1
Catégorie 2
Catégorie 3
Accueil | Catégorie 1
Catégorie 2
Catégorie 3
Les menus cote à cote :
<?php $plxShow->catList($plxShow->getLang('HOME'),'<li class="#cat_status" id="#cat_id"><a href="#cat_url" title="#cat_name">#cat_name</a></li>'); ?>
<?php $plxShow->pageBlog('<li id="#page_id"><a class="#page_status" href="#page_url" title="#page_name">#page_name</a></li>'); ?>
<?php $plxShow->catList($plxShow->getLang('HOME'),'<li class="#cat_status" id="#cat_id"><a href="#cat_url" title="#cat_name">#cat_name</a></li>'); ?>
<?php $plxShow->pageBlog('<li id="#page_id"><a class="#page_status" href="#page_url" title="#page_name">#page_name</a></li>'); ?>
Seront visibles sous la forme :
Accueil | Catégorie 1 | Catégorie 2 | Catégorie 3
Accueil | Catégorie 1 | Catégorie 2 | Catégorie 3
Les menus catégories sauf la catégorie 2 :
<?php $plxShow->catList('','<li><a href="#cat_url" title="#cat_name">#cat_name</a></li>','',2); ?>
Seront visibles sous la forme :
Catégorie 1 | Catégorie 3 | Catégorie 4
Catégorie 1 | Catégorie 3 | Catégorie 4
Le menu Catégorie 1 uniquement :
<?php $plxShow->catList('','<li><a href="#cat_url" title="#cat_name">#cat_name</a></li>',1); ?>
Sera visible sous la forme :
Catégorie 1
Les instructions d'origines afin de restaurer votre fichier /themes/defaut/header.php (sans menus) :
<?php $plxShow->staticList($plxShow->getLang('HOME'),'<li class="#static_status" id="#static_id"><a href="#static_url" title="#static_name">#static_name</a></li>'); ?>
<?php $plxShow->pageBlog('<li id="#page_id"><a class="#page_status" href="#page_url" title="#page_name">#page_name</a></li>'); ?>
