Using More than One Template

[Zegnåt]

Assuming we’re talking about the same thing as yesterday, that HTML is not going to cut it.

This is the HTML you want to get (taken from the original page you linked):

Code:

<div id="navcontainer">
    <div id="p7PMM_1" class="p7PMMh06 p7PMMnoscript">
        <ul class="p7PMM">
            <li><a href="index.php">Home</a></li>
            <li><a href="pastor-and-tammy.php">Pastor and Tammy</a></li>
            <li><a href="#">Ministries</a>
                <div>
                    <ul>
                        <li><a href="womens-ministry.php">Women's Ministry</a></li>
                        <li><a href="mens-ministry.php">Men's Ministry</a></li>
                        <li><a href="childrens-ministry.php">Children's Ministry</a></li>
                        <li><a href="youth-ministry.php">Youth Ministry</a></li>
                    </ul>
                </div>
            </li>
            <li><a href="music.php">Music</a></li>
            <li><a href="connect-groups.php">Connect Groups</a></li>
            <li><a href="#">Board and Staff</a>
                <div>
                    <ul>
                        <li><a href="staff.php">Staff</a></li>
                        <li><a href="board-of-directors.php">Board of Directors</a></li>
                    </ul>
                </div>
            </li>
            <li><a href="prayer-requests.php">Prayer Requests</a></li>
            <li><a href="contact-us.php">Contact Us</a></li>
        </ul>
        <div class="p7pmmclearfloat">&nbsp;</div>
        <!--[if lte IE 6]>
        <style>.p7PMMh06 ul ul li {float:left; clear: both; width: 100%;}.p7PMMh06 {text-align: left;}.p7PMMh06, .p7PMMh06 ul ul a {zoom: 1;}</style>
        <![endif]-->
        <!--[if IE 5]>
        <style>.p7PMMh06, .p7PMMh06 ul ul a {height: 1%; overflow: visible !important;} .p7PMMh06 {width: 100%;}</style>
        <![endif]-->
        <!--[if IE 7]>
        <style>.p7PMMh06, .p7PMMh06 a{zoom:1;}.p7PMMh06 ul ul li{float:left;clear:both;width:100%;}</style>
        <![endif]-->
        <script type="text/javascript">
            <!--
            P7_PMMop('p7PMM_1',1,2,-5,-5,0,0,0,1,0,3,1,1,0,0,0);
            //-->
        </script>
    </div>
</div>

This is the HTML you are generating:

Code:

<div id="navcontainer">
    <div id="p7PMM_1" class="p7PMMh06 p7PMMnoscript">
        <ul class="p7PMM">
            <ul class="menu">
                <li class="active"><a href="http://www.memoriesdesign.com/getsimple/">Home</a></li>
                <li><a href="http://www.memoriesdesign.com/getsimple/index.php?id=new-page">New Page</a>
                    <ul class="submenu">
                        <li><a href="http://www.memoriesdesign.com/getsimple/index.php?id=another-new-page">Another New Page</a></li>
                    </ul>
                </li>
            </ul>
        </ul>
    </div>
</div>

In this there are a few big differences that I think will need fixing:

• The generated HTML has an extra UL around the menu because the plugin adds one, this one will need to be removed from the plugin;
  
• The generated HTML does not have the extra DIV around the submenu lists;
  
• The original HTML has extra CSS stylesheets at the bottom to fix problems experienced in Internet Explorer, if you want your menu to work at all in IE you will need to copy these over;
  
• The original HTML has to expicitly call the Javascript to be applied to the menu, this will need to be copied to the GetSimple template as well.
  

That last point is the trickiest, I can’t tell you what the different data does that is passed into it so I do not know whether this has to be made dynamic in any way as well.

That’s all you’ll find in my brain for now. If you want I can change my plugin slightly to fix the first two points. The third point is easily fixed but the last one stays an unknown till you experiment with it.