Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 4 of 4
  1. #1
    Senior Member bamme's Avatar
    Join Date
    Aug 2009
    Posts
    319
    Member #
    19662
    Liked
    1 times
    Hi all

    I'm working with this wordpress theme: http://www.cadengrant.me/wpthemes/?theme=PictureThis

    It uses custom menus to display the list items on the left of the screen, shown as the black 'tabs'.

    Here is the code:

    <div class="navigation">
    <?php if ( has_nav_menu( 'primary-menu' ) ) { /* if menu location 'primary-menu' exists then use custom menu */ ?>
    <?php wp_nav_menu( array( 'theme_location' => 'primary-menu', 'menu_class' => 'menu', 'container' => 'ul' ) ); ?>
    <?php } else { /* else use wp_list_pages */ ?>
    <ul class="menu">
    <?php wp_list_pages( array('title_li' => '')); ?>
    </ul>
    <?php } ?>
    </div>

    Can i ask Ė would it be possible to somehow assign a separate class to each of the navigation menuís list items? perhaps some auto incrementing number for the class, that iíd include in my code with php?

    (I want to assign diff background images to diff list items is why i ask)

    Thanks v much

    Emma

  2.  

  3. #2
    Senior Member bamme's Avatar
    Join Date
    Aug 2009
    Posts
    319
    Member #
    19662
    Liked
    1 times
    any ideas? i know this must be able to be done.. i just dont know php damnit..

  4. #3
    WDF Staff AlphaMare's Avatar
    Join Date
    Oct 2009
    Location
    Montreal, Canada
    Posts
    4,570
    Member #
    20277
    Liked
    878 times
    I just went and looked at the code - each menu <li> has a unique id.
    This may be as simple as making a specific style for each id.
    For example:
    HTML (as rendered by the php)
    <li id="menu-item-328" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-328"><a href="whatever/">Home</a></li>
    If you're going the PHP route, I suspect it may mean whriting a new "if" loop.
    I have done this for a menu once (for a site which wanted to display some horses for lease), but to include pages rather than classes - but you can probably modify it to work:
    What I did:

    <?php

    $page="";
    if(isset($_GET['page']))
    { $page=$_GET['page']; }

    if(($page == "donnie")) {
    include_once("donnie.php");
    }
    else if(($page == "master")) {
    include_once("master.php");
    }
    else if(($page == "ripple")) {
    include_once("ripple.php");
    }
    else if(($page == "chester")) {
    include_once("chester.php");
    }
    ?>

    What this did was load a new page with the description, image and other details about each horse into a specific div on the site.

    You'd have to change the product name to the id of the menu item, and the include would have to be changed somehow to reflect the class for the id that holds the background you want. I'm not up to that yet, I'm afraid, and I hope I'm not leading you astray here.

    PS
    I've gone and read the comments by Caden Grant - not a very helpful soul, is s/he?
    You may want to cross-post this to the PHP forum.
    Good design should never say "Look at me!"
    It should say "Look at this." ~ David Craib


    http://digitalinsite.ca ~ my current site . . info@digitalinsite.ca ~ my email

    If you feel that someone's post helped you fix your problem, answered your question, or just made you feel better, feel free to "Like" their post. The "Like" link is at the bottom right of each post, along side the "reply" link. And if you are being helped here, try to help someone else - pass it on!

  5. #4
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    I don't see a way to do it in WP's code... you could probably write a hook to do it, but I don't know enough about WP to tell you how to do that.

    You COULD, however, simply tackle the problem by using CSS3 pseudo-selectors, e.g.

    [COLOR=rgb(0, 0, 0)]ul.menu li:nth-child(1) {[/COLOR]
    [COLOR=rgb(0, 0, 0)]}[/COLOR]
    [COLOR=rgb(0, 0, 0)]ul.menu [/COLOR][COLOR=rgb(0, 0, 0)]li:nth-child(2)[/COLOR][COLOR=rgb(0, 0, 0)] {[/COLOR]
    [COLOR=rgb(0, 0, 0)]}[/COLOR]
    [COLOR=rgb(0, 0, 0)]ul.menu [/COLOR][COLOR=rgb(0, 0, 0)]li:nth-child(3)[/COLOR][COLOR=rgb(0, 0, 0)] {[/COLOR]
    [COLOR=rgb(0, 0, 0)]}[/COLOR]
    [COLOR=rgb(0, 0, 0)]ul.menu [/COLOR][COLOR=rgb(0, 0, 0)]li:nth-child(4)[/COLOR][COLOR=rgb(0, 0, 0)] {[/COLOR]
    [COLOR=rgb(0, 0, 0)]}[/COLOR]

    [COLOR=rgb(0, 0, 0)]The only downside is that it won't work in IE (yet, next version will fix that)[/COLOR]


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 10:00 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com