• I want to use a plugin to turn my existing horizontal menu to a drop down for child pages. Many of my parent pages however have links in the sidebar so are excluded (ie not visible in the menu bar). So I want drop downs only for my visible pages — I need to keep the $exclude code.

    Is it possible to merge my existing header code with the code of a plugin? Or is it more complicated than that?
    Eg.
    Here is some new code:
    <?php if (function_exists('suckerfish')) {suckerfish();} ?>

    Or this:
    <?php wswwpx_fold_page_list ($arglist); ?>

    Or this:

    <?php
    echo wp_jquery_dropdownmenu(2, “Blog”,1, 0);?>

    And here is my existing code:
    <?php wp_list_pages('sort_column=menu_order&title_li=&exclude=7,8,9');?>

    Please give me the exact code needed, as I am not php literate. Thank you for your time.

Viewing 1 replies (of 1 total)
  • dropdowns are just done with CSS, no need for special PHP stuff. Use wp_list_pages with your necessary excludes like you normally would, then style the output so it’s a dropdown menu.

    in your header.php, right before the < / head> tag, insert this:

    <!--[if lt IE 7]>
    	<style type="text/css" media="screen, tv, projection">
    		body { behavior: url("<?php bloginfo('template_directory'); ?>/code/csshover.htc"); }
    	</style>
    <![endif]-->

    Then open your style.css file, and add this:

    /*------- Rolling Menu Styles ------------
    Based on Menu from Jullij Theme https://www.jillij.com
    */
    
    #menu {display: block;border: 0px;padding: 0px 0px 0px 0px;margin: 0px 0px 0px 20px;z-index: 5;position: relative;}
    #menu ul {width:660px;min-height: 20px;line-height: 20px;list-style-type: none;padding: 0px 0px 0px 0px;margin: 0px 0px 0px 0px;z-index: 500;	font-weight: bold;}
    #menu li {display: inline;float: left;min-height: 20px;position: relative;text-align: left;padding: 0px 10px 0px;margin: 0px 0px 0px 0px;width: 100px;}
    #menu li ul {width: 200px;height: auto;top: 100%;left: 0px;		font-weight: normal;}
    #menu li ul li {text-align: left;width: 200px;	height: auto;min-height: auto;display: block;}
    #menu a {text-decoration: none;}
    #menu li li ul {top: 0;left: 0;}
    #menu li li:hover ul {left: 220px;}
    
    /* initialy hide all sub sidemenus */
    #menu ul ul,
    #menu ul li:hover ul ul,
    #menu ul ul li:hover ul ul,
    #menu ul ul ul li:hover ul ul,
    #menu ul ul ul ul li:hover ul ul {position: absolute;display:none;color: #FFFFFF;}
    
    /* display them on hover */
    #menu li:hover ul,
    #menu ul li:hover ul,
    #menu ul ul li:hover ul,
    #menu ul ul ul li:hover ul,
    #menu ul ul ul ul li:hover ul,
    #menu ul ul ul ul ul li:hover ul {display: block; color: #FFFFFF;}
    
    /* define the consecutive colors */
    #menu {color: #333333;}
    #menu ul{background: #FFFFFF;-moz-opacity:0.95; /* for mozilla */opacity: 0.95; /* for safari */khtml-opacity: 0.95 /* for konquerer and older safari */}
    #menu ul ul {background: #FFFFFF;}
    #menu ul li {background: #FFFFFF;}
    #menu h2 {color: #ffffff;}
    #menu a {color: #333333;}
    #menu a:hover {color: #ffffff;}
    #menu ul li:hover {background: #3399cc;color: #FFFFFF;}
    #menu ul li ul {}
    #menu ul li ul li {background: #FFFFFF;}
    #menu ul li ul li:hover {background: #3399cc;color: #FFFFFF;}
    #menu ul li ul ul li{background: #FFFFFF;}
    #menu ul li ul ul li:hover {background: #3399cc;color: #FFFFFF;}

    Of course you need to adapt the colors, sizes and positions. But that’s basically it.
    You’ll want to download the internet-explorer-7-anti-screwup-special-file you added to your header, so head on over to https://www.jillij.com/wordpress-theme/ (this is where I got the initial code from) and download the theme, then copy the necessary file called csshover.htc to your theme directory.

    I used it on https://www.smarttimes.at as well, in case you want to do some css-comparing.

Viewing 1 replies (of 1 total)
  • The topic ‘drop down menu with $exclude?’ is closed to new replies.