[resolved] Styling a css menu - WP 3.0 (5 posts)

  1. akatche
    Posted 5 years ago #

    Hi Friends, I have this problem. I'm using the new menu creator included in WordPress version 3.0, and when creating a menu creates this code

    <ul class="sub-menu">
    <li id="menu-item-194" class="menu-item menu-item-type-taxonomy">Name 1
    <li id="menu-item-195" class="menu-item menu-item-type-taxonomy">Name 2

    My question is how do I style each li individually?

  2. mrmist
    Forum Janitor
    Posted 5 years ago #


    You can use

    wp_nav_menu( array( 'theme_location' => 'my-menu','container_class' => 'my_menu_div','menu_class' => 'my_menu_class' ));

    To assign class names..

  3. Michael
    Part-Time Forum Moderator
    Posted 5 years ago #

    in your style sheet (style.css ?) try to use:
    (because what you see are the html links, it is probably better to use the links for the styling; this depends slighly on your theme's other styles)

    li#menu-item-194 { /*individual styles for 194*/ }
    li#menu-item-194 a { /*individual styles for the link 194*/ }
    li#menu-item-195 a { /*individual styles for 195*/ }

    if you need the current style to be individual as well, you could try additional:

    li#menu-item-194.current-menu-item a { /*individual styles for current 194*/ }

  4. akatche
    Posted 5 years ago #

    Thank you both for your prompt answer! I based my work on alchymyth comment and finally the code looked like this:

    li#menu-item-194.menu-item-type-taxonomy a {
    /*individual styles for current 194*/
  5. digitalrenewal
    Posted 4 years ago #

    wordpress now allows you to add individual classes to each menu item. In your appearance > menus, pull down screen options, turn on css classes and there will be a field in each menu item to add a class. Now you can assign and style those classes individually.

Topic Closed

This topic has been closed to new replies.

About this Topic