Announcement

Collapse
No announcement yet.

Adding Menu

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Adding Menu

    Hello (Jake?)... I have added left and right columns from this thread. In the left column, I would like to add a TreeMenu from this site I think I have the code right to make it happen but I am not sure as to WHERE to put it. Every time I insert what I think is what I need... I just see the actual code on my page when I refresh.

    Do I add something into the headinclude? Pretty much lost.... Any help to point me in the right direction would be great.

  • #2
    It looks like that menu uses javascript. Generally you would put the javascript code into the headinclude template. The javascript would be the code between the <script></script> tags.

    Comment


    • #3
      Hmmmm.... it also uses a php file (TreeMenu.php) and a js file (TreeMenu.js) to create it. below is a php file that it used as an example. I haven't don't any thing to the below and it works as a standalone, but I am not sure what or where to put some of its parts into vbulletin.

      PHP Code:
      <?php
          
      require_once('TreeMenu.php');
          
      //require_once('../TreeMenu.php');

          
      $icon         'folder.gif';
          
      $expandedIcon 'folder-expanded.gif';

          
      $menu  = new HTML_TreeMenu();

              
      $node1   = new HTML_TreeNode(array('text' => "First level"'link' => "test.php"'icon' => $icon'expandedIcon' => $expandedIcon'expanded' => true), array('onclick' => "alert('foo'); return false"'onexpand' => "alert('Expanded')"));
                  
      $node1_1 = &$node1->addItem(new HTML_TreeNode(array('text' => "Second level"'link' => "test.php"'icon' => $icon'expandedIcon' => $expandedIcon)));
          
      $node1_1_1 = &$node1_1->addItem(new HTML_TreeNode(array('text' => "Third level"'link' => "test.php"'icon' => $icon'expandedIcon' => $expandedIcon)));
          
      $node1_1_1_1 = &$node1_1_1->addItem(new HTML_TreeNode(array('text' => "Fourth level"'link' => "test.php"'icon' => $icon'expandedIcon' => $expandedIcon)));
          
      $node1_1_1_1->addItem(new HTML_TreeNode(array('text' => "Fifth level"'link' => "test.php"'icon' => $icon'expandedIcon' => $expandedIcon'cssClass' => 'treeMenuBold')));

              
      $node1->addItem(new HTML_TreeNode(array('text' => "Second level, item 2"'link' => "test.php"'icon' => $icon'expandedIcon' => $expandedIcon)));
          
              
      $node1->addItem(new HTML_TreeNode(array('text' => "Second level, item 3"'link' => "test.php"'icon' => $icon'expandedIcon' => $expandedIcon)));

          
      $menu->addItem($node1);
          
      $menu->addItem($node1);
          
          
      // Create the presentation class
          
      $treeMenu = &new HTML_TreeMenu_DHTML($menu, array('images' => '../images''defaultClass' => 'treeMenuDefault'));
          
      $listBox  = &new HTML_TreeMenu_Listbox($menu, array('linkTarget' => '_self'));
      ?>
      <html>
      <head>
          <style type="text/css">
              body {
                  font-family: Georgia;
                  font-size: 11pt;
              }
              
              .treeMenuDefault {
                  font-style: italic;
              }
              
              .treeMenuBold {
                  font-style: italic;
                  font-weight: bold;
              }
          </style>
          <script src="TreeMenu.js" language="JavaScript" type="text/javascript"></script>
      </head>
      <body>

      <script language="JavaScript" type="text/javascript">
      <!--
          a = new Date();
          a = a.getTime();
      //-->
      </script>

      <?$treeMenu->printMenu()?>
      <?$listBox
      ->printMenu()?>

      </body>
      </html>

      Comment


      • #4
        If the menu is generated by a PHP file, then you can capture the output of that file by adding this code to your phpinclude_start template:

        Code:
        ob_start();
        require("path/filename.php");
        $tree_menu = ob_get_contents();
        ob_end_clean();
        Now you can use $tree_menu in your templates and it will parse to the HTML of the menu as generated by filename.php.

        Comment


        • #5
          Well after further review of this thing, I am wondering if I really need to have all of it, this is how it works.

          The basic procedure to create a menu is only three steps:

          1. Create a TreeMenu object and a tree of TreeNodes, one node for each menu item.
          2. Create a Presentation object for the type of menu you wish to display.
          3. Print it (generate the HTML and JavaScript).

          Above <!DOCTYPE HTML PUBLIC "-//W3C//DTD..... add:
          PHP Code:
          <?php

            $pgEmailSubj 
          'HTML_TreeMenu_Page';

            
          // Control dynamic style sheet
            
          $styleBodyIndent=true;
            
          $styleBodyBGcolor="#FFDBB7";

            if (
          file_exists'TreeMenuXL.php' ))
              include_once( 
          'TreeMenuXL.php' );
            else 
              include_once( 
          $_SERVER['DOCUMENT_ROOT'] . '/bin/TreeMenuXL.php' );

            
          // Menu00 -- Based on the original example
            // Should be as basic as possible.
            
          $menu00  = new HTML_TreeMenuXL();
            
          $nodeProperties = array("icon"=>"folder.gif");
            
          $node0 = new HTML_TreeNodeXL("INBOX""#"$nodeProperties);
            
          $nx = &$node0->
              
          addItem(new HTML_TreeNodeXL("A Folder""#link1"$nodeProperties));
            
          $nx = &$nx->
                
          addItem(new HTML_TreeNodeXL("Nested Folder""#link2"$nodeProperties));
            
          $nx = &$nx->
                  
          addItem(new HTML_TreeNodeXL("Deeper ...""#link3"$nodeProperties));
            
          $nx = &$nx->
                    
          addItem(new HTML_TreeNodeXL("... and Deeper""#link4"$nodeProperties));
            
            
          $node0->addItem(new HTML_TreeNodeXL("deleted-items""#link5"$nodeProperties));
            
          $node0->addItem(new HTML_TreeNodeXL("sent-items",    "#link6"$nodeProperties));
            
          $node0->addItem(new HTML_TreeNodeXL("drafts",        "#link7"$nodeProperties));    
            
          $node0->addItem(new HTML_TreeNodeXL("spam",          "#link8"$nodeProperties));    
            
            
          $menu00->addItem($node0);
            
          $menu00->addItem(new HTML_TreeNodeXL("My Stuff",     "#link9"$nodeProperties));
            
          $menu00->addItem(new HTML_TreeNodeXL("Other Stuff",  "#link10"$nodeProperties));
            
          $menu00->addItem($node0);

            
          // Menu03 -- This uses no icons.  The plus/minus are still present
            
          $nodeProperties = array("cssClass"=>"auto");
            
          $menu03  = new HTML_TreeMenuXL();
            
          $node03  = new HTML_TreeNodeXL("INBOX""#"$nodeProperties);
            
          $nx = &$node03->
              
          addItem(new HTML_TreeNodeXL("A Folder""#link1"$nodeProperties));
            
          $nx = &$nx->
                
          addItem(new HTML_TreeNodeXL("Nested Folder""#link2"$nodeProperties));
            
          $nx = &$nx->
                  
          addItem(new HTML_TreeNodeXL("Deeper ...""#link3"$nodeProperties));
            
          $nx = &$nx->
                    
          addItem(new HTML_TreeNodeXL("... and Deeper""#link4"$nodeProperties));

            
          $node03->addItem(new HTML_TreeNodeXL("deleted-items""#link5"$nodeProperties));
            
          $node03->addItem(new HTML_TreeNodeXL("sent-items",    "#link6"$nodeProperties));
            
          $node03->addItem(new HTML_TreeNodeXL("drafts",        "#link7"$nodeProperties));    
            
          $node03->addItem(new HTML_TreeNodeXL("spam",          "#link8"$nodeProperties));    
            
            
          $menu03->addItem($node03);
            
          $menu03->addItem(new HTML_TreeNodeXL("My Stuff",      "#link9"$nodeProperties));
            
          $menu03->addItem(new HTML_TreeNodeXL("Other Stuff",   "#link10"$nodeProperties));
            
          $menu03->addItem($node03);
            
          ?>
          right after above add:
          Code:
          <script src="TreeMenu.js" language="JavaScript" type="text/javascript"></script>
          Then to call it all:
          Code:
                <?php 
                  // Create the presentation object
                  $example010 = &new HTML_TreeMenu_DHTMLXL($menu00, array("images"=>"TMimages"));
                  $example010->printMenu();
                ?>

          Comment


          • #6
            Sorry, forgot to add... I wonder if I could just put the php and script into a template and then use the presentation object to get it to show.... a working php file is here at www.4xtraders.com/menu/ and click on test.php

            Comment


            • #7
              Originally posted by plan_b
              Sorry, forgot to add... I wonder if I could just put the php and script into a template and then use the presentation object to get it to show.... a working php file is here at www.4xtraders.com/menu/ and click on test.php
              That should work with the method I posted, except you will probably have problems with the relative paths of some of the elements in the source of that page. For example:

              Code:
              <script src="TreeMenu.js" language="JavaScript" type="text/javascript"></script>
              This will look for TreeMenu.js in your forum directory. The same problem exists for all of the image references in the source. Look at all of the folder.gif references.

              Comment


              • #8
                ok... as I am going to be also creating a main index page (outside of the /forum) I was wondering if I should just use the full path with every thing

                Comment


                • #9
                  If you are referencing that menu from different directories, then it would probably be best to use full paths. For example:

                  Code:
                  <script src="[color=red]/menu/[/color]TreeMenu.js" language="JavaScript" type="text/javascript"></script>

                  Comment


                  • #10
                    ok... get'n a blank area that the menu should be. This is what I got/done:

                    phpinclude_start
                    ob_start();
                    require("/menu/test.php");
                    $tree_menu = ob_get_contents();
                    ob_end_clean()

                    and I am using $tree_menu in my column

                    with:
                    <script src="/menu/TreeMenu.js" language="JavaScript" type="text/javascript"></script>
                    in the /menu/test.php

                    Any ideas?

                    Comment


                    • #11
                      bump

                      Comment


                      • #12
                        Any one have an idea of how I can do this?

                        Comment


                        • #13
                          Try using a full server path in the require line. For example:

                          /home/yoursite/public_html/menu/test.php

                          Your full server path might be different.

                          Comment


                          • #14
                            are items in a js file the same as javascript?

                            Comment


                            • #15
                              js files are javascript files, yes. They contain javascript code.

                              Comment

                              widgetinstance 262 (Related Topics) skipped due to lack of content & hide_module_if_empty option.
                              Working...
                              X