Joomla!-开源天空

我们在这篇文章：标准Joomla!后台管理界面中各个区域的划分图解  中说明个后台管理页面的区域划分，submenu 就是下图中的区域四。

实现submenu需要两个步骤：

一是创建一个navigation.php文件，放在 tmpl文件夹下，我们的示例中的navigation.php代码如下：

<div class="submenu-box">
 <div class="submenu-pad">
  <ul id="submenu">
   <li><a id="site" class="active">Site</a></li>
   <li><a id="system">System</a></li>
   <li><a id="server">Server</a></li>
  </ul>
  <div class="clr"></div>
 </div>
</div>
<div class="clr"></div>

二是修改视图文件view.html.php，我们示例中的代码如下:

  $contents = '';
  $tmplpath = dirname(__FILE__).DS.'tmpl';
  ob_start();
  require_once($tmplpath.DS.'navigation.php');
  $contents = ob_get_contents();
  ob_end_clean();
  $document =& JFactory::getDocument();
  $document->setBuffer($contents, 'module', 'submenu');

实质上就是将navigation.php文件读出来，并按模块的方式进行渲染，保存在文档的缓冲区中。

以上两部就实现了，submenu的显示，但是我们知道实际上点击后切换要通过switcher.js来实现，在这篇文章中Joomla!中如何使用switcher.js实现一个位置上div层的切换显示 具体讲述了如何实现 switcher,请参考。

 实现我们示意图效果的模板文件的代码如下：

<?php defined('_JEXEC') or die('Restricted access'); ?>
<?php JHTML::_('behavior.switcher');?>
<div id="config-document">
  <div id="page-site">
      <?php echo $this->pane->startPane( 'jam-pane'); ?>
       <?php echo $this->pane->startPanel('panel1', 'panel1' ); ?>
       panel111111111111111111
       <?php echo $this->pane->endPanel(); ?>
       <?php echo $this->pane->startPanel('panel2', 'panel2' ); ?>
       panel222222222222222222
       <?php echo $this->pane->endPanel(); ?>
      <?php echo $this->pane->endPane(); ?> 
   </div>  
  <div id="page-system">
   system!!!!!!!!!
   </div>  
  <div id="page-server">
   server!!!!!!!!!
   </div> 
</div>