j'ai récemment passé mon site sur wordpress et j'ai voulu modifier mon thème en intégrant un menu déroulant vertical.
J'ai modifié le code du header grâce au tutoriel de ce site et je l'ai un peu modifié pour qu'il corresponde à mes besoins (avec l'aide de quelqu'un, bien entendu..).
Je souhaiterais utiliser ce menu déroulant à la fois pour les catégories, les sous catégories et les sous-sous catégories (excusez moi mais je ne sais pas trop quel autre vocabulaire employer...).
Le code du menu ne devait pas être prévu pour les sous-sous catégories (ou catégories filles filles ^^)
J'ai décelé un problème dans l'affichage des sous-sous catégories (voyez vous-même http://montaigu.basket.free.fr/ en passant votre souris sur l'onglet "présentation du club" > la catégorie fille-fille "création" empêche de cliquer sur la catégorie fille "le bureau")
mais je n'ai pas assez de connaissance en code pour trouver ce qui cloche.
Voici le code en question :
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> » Blog Archive <?php } ?> <?php wp_title(); ?></title>
<meta name="distribution" content="global" />
<meta name="language" content="en, sv" />
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" />
<link rel="shortcut icon" type="image/x-icon" href="/mafavicon.ico" />
<meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo('charset'); ?>" />
<style type="text/css" media="screen">
@import url( <?php bloginfo('stylesheet_url'); ?> );
</style>
<?php wp_head(); ?>
</head>
<body style="background-color: #B6C1C9">
<br/>
<div id="wrapper">
<div id="masthead">
<style type="text/css" media="screen">#nav2 {
background:#777;
font-size:1.1em;
}
#nav2, #nav2 ul {
list-style: none;
line-height: 1;
}
#nav2 a ,#nav2 a:hover{
display: block;
text-decoration: none;
border:none;
}
#nav2 li {
float: left;
list-style:none;
border-right:1px solid #a9a9a9;
}
#nav2 a,#nav2 a:visited {
display:block;
font-weight:bold;
color: #f5f5f4;
padding:6px 12px;
}
.children {
padding:0px;
border-top:2px
}
.children .children, .children .children a {
padding-left:40px;
float:none;
}
#nav2 a:hover, #nav2 a:active
{
background:#000;
text-decoration:none
}
/* Dropdown Menu */
#nav2 li ul {
position: absolute;
left: -999em;
height: auto;
width: 174px;
border-bottom: 1px solid #a9a9a9;
}
#nav2 li li {
width: 172px;
border-top: 1px solid #a9a9a9;
border-right: 1px solid #a9a9a9;
border-left: 1px solid #a9a9a9;
background: #777;
}
#nav2 li li a,#nav2 li li a:visited{
font-weight:normal;
font-size:0.9em;
color:#FFF;
}
#nav2 li li a:hover,#nav2 li li a:active{
background:#000;
}
#nav2 li:hover ul, #nav2 li li:hover ul, #nav2 li li li:hover ul, #nav2 li.sfhover ul, #nav2 li li.sfhover ul, #nav2 li li li.sfhover ul{
left: auto;
}
a.main:hover{
background:none;
} </style>
<div id="menu">
<ul id="nav2" class="clearfloat">
<li><a href="<?php echo get_option('home'); ?>/" class="on">Accueil</a></li>
<?php wp_list_categories('sort_column=post_date&sort_order=desc&title_li=');
$this_category = get_category($cat);
if (get_category_children($this_category->cat_ID) != "") {
echo "<ul>";
wp_list_categories('orderby=id&show_count=0&title_li=&use_desc_for_title=1&child_of='.$this_category->cat_ID);
echo "</ul>";
}
?>
</ul>
</ul>
<a href=""></div>
</div>
<!-- Begin #content -->
<div id="content">Merci d'avance à ceux qui se pencheront sur mon problème.