您现在的位置是:首页 > cms教程 > Ecshop商城教程Ecshop商城教程

ecshop商城简单三步实现导航商品分类二级菜单的方法

孤岚2023-12-09Ecshop商城教程已有人查阅

导读1.在page_header.lbi对应的位置(你想显示导航的位置)插入 (注意下面的 themes/模板名称/util.php中的模板名称改成你模板 文件 夹的名称)

1.在page_header.lbi对应的位置(你想显示导航的位置)插入 (注意下面的 themes/模板名称/util.php中的模板名称改成你模板 文件 夹的名称) ? php require_once(themes/模板名称/util.php); ? div class = h  1.在page_header.lbi对应的位置(你想显示导航的位置)插入
(注意下面的"themes/模板名称/util.php"中的"模板名称"改成你模板文件夹的名称)
<?phprequire_once("themes/模板名称/util.php");  ?>  <div class="header-menu">
<p {if $navigator_list.config.index eq 1} class="cur" {/if}><a href="../index.php">{$lang.home}</a></p>
 <ul>
 <!-- {foreach name=nav_middle_list from=$navigator_list.middle item=nav} -->
 <li onMouseOver="sw_nav(this,1);" onMouseOut="sw_nav(this,0);" {if $nav.active eq 1} class="curs"{/if}>
 <a href="{$nav.url}" {if $nav.opennew eq 1}target="_blank" {/if}>{$nav.name}</a>
<?php
$subcates = get_subcate_byurl($GLOBALS['smarty']->_var['nav']['url']);
 if($subcates!=false)
{
  if(count($subcates)>0)
{
echo "<div class='sub_nav'>";
  if($subcates)
  {
  foreach($subcates as $cate)
  {
  echo "<a href='".$cate['url']."' class='level_1'>".$cate['name']."</a>";
 }
  }
 echo "</div><iframe frameborder='0' scrolling='no' class='nomask'></iframe>";
}
}
 ?>
 </li>
 <!-- {/foreach} -->
  </ul>
  <script type="text/javascript">
  //初始化主菜单
function sw_nav(obj,tag)
{
  var subdivs = obj.getElementsByTagName_r("DIV");
var ifs = obj.getElementsByTagName_r("IFRAME");
if(subdivs.length>0)
{
if(tag==1)
  {
  subdivs[0].style.display = "block";
  ifs[0].style.display = "block"; 
}
  else
  {
  subdivs[0].style.display = "none";
   ifs[0].style.display = "none"; 
} 
} 
}
</script>
</div>
2.在CSS文件中插入
.header-menu p{ float:left;padding:1px 12px 1px 0;margin-top:-2px;}  .header-menu  ul li{float:left;padding:1px 12px 1px 12px;margin-top:-2px;}  .header-menu ul li a,.header-menu p a{color: #333;display:block;}  .header-menu ul li a:hover,.header-menu p a:hover{color:#888;}  .header-menu ul li.curs{background:#999;}  .header-menu ul li.curs a{color:#fff;} .sub_nav{ background:#999;width:110px; position:absolute; z-index:5003; display:none;margin-left:-12px;}  .nomask{ background:#fff; width:110px; height:50px; position:absolute; z-index:5002;display:none;margin-left:-12px;}  .sub_nav a.level_1{ display:block;color:#fff;padding:6px 6px 6px 13px;font:11px Tahoma,Verdana,PMingLiU,Arial;border-bottom:1px dotted #D1D1D1;*border-bottom:1px dotted #D1D1D1 !important;*border-bottom:1px solid #A8A8A8;}  .sub_nav a.level_1:hover{color:#fff;background:#55B46C;text-decoration:none;} 
3.把以下代码编辑成(util.php)解压出来拷贝到模板目录下
<?php function get_subcate_byurl($url) 
{
$rs = strpos($url,"category"); 
if($rs!==false)  
{
preg_match("/\d+/i",$url,$matches);
$cid = $matches[0]; 
$cat_arr = array();
$sql = "select * from ".$GLOBALS['ecs']->table('category')." where parent_id=".$cid." and is_show=1";
$res = $GLOBALS['db']->getAll($sql);
foreach($res as $idx => $row)
{
  $cat_arr[$idx]['id']   = $row['cat_id'];
  $cat_arr[$idx]['name'] = $row['cat_name'];
  $cat_arr[$idx]['url']  = build_uri('category', array('cid' => $row['cat_id']), $row['cat_name']);
  $cat_arr[$idx]['children'] = get_clild_list($row['cat_id']); 
  }
return $cat_arr;
}
else
{
return false;
}
}
function get_clild_list($pid)
{
 //开始获取子分类
$sql_sub = "select * from ".$GLOBALS['ecs']->table('category')." where parent_id=".$pid." and is_show=1"; 
$subres = $GLOBALS['db']->getAll($sql_sub);
if($subres)
{
foreach ($subres as $sidx => $subrow)
{
  $children[$sidx]['id']=$subrow['cat_id'];
  $children[$sidx]['name']=$subrow['cat_name'];
  $children[$sidx]['url']=build_uri('category', array('cid' => $subrow['cat_id']), $subrow['cat_name']);
}
 }
else
{
$children = null;
}
return $children;
  }
?>

本文标签:

很赞哦! ()

相关源码

  • PbootCMS(自适应手机端)智能电话AI机器人网站模板产品概述基于PbootCMS内核开发的智能电话AI机器人网站模板,为语音交互服务场景设计,采用HTML5+CSS3响应式布局技术,实现PC端与移动端数据实时同步展示。模板适用于智能电话查看源码
  • (PC+WAP)蓝色弹簧针厂家探针充电连接器设备网站源码下载基于PbootCMS开发的响应式模板,为弹簧针、探针连接器等电子元器件企业设计。模板采用工业蓝主色调,突出产品技术特性,支持多维度展示连接器产品的规格参数与应用场景,帮助制造企业建立专业线上展示平台。查看源码
  • pbootcms模板(PC+WAP)APP应用软件下载类官网源码为APP应用软件官网打造的响应式解决方案,PC端与移动端(WAP)数据实时同步,一次更新全网生效,满足多终端用户无缝体验需求。查看源码
  • (自适应HTML5)响应式智能设备人工智能机器pbootcms源码免费下载这款基于PbootCMS开发的网站模板为人工智能和智能设备行业设计,采用现代化科技风格,突出产品的智能特性和技术创新。模板架构合理,功能完善,能够有效展示各类智能产品的核心功能和解决方案。查看源码
  • (自适应响应式)英文外贸医疗科研耗材设备pbootcms网站模板为医疗设备和外贸企业设计的响应式网站模板,基于PbootCMS系统开发。突出医疗产品认证展示和国际化特性,通过专业化的产品参数展示模块和文档管理系统,满足医疗行业严格的信息披露要求。查看源码
  • (自适应响应式)高端网站建设设计公司互联网营销网站pbootcms模板本模板基于PbootCMS内核开发,为网站建设公司和互联网营销企业量身打造。采用响应式设计,适配各种移动设备,提供统一的后台管理体验查看源码
分享笔记 (共有 篇笔记)
验证码:

本栏推荐