EMLOG侧边栏二级分类实现折叠和树状展开
我们知道,EMLOG原生侧边栏上的分类组件默认是展开的,如果网站分类比较多的话就占用很大的侧边栏篇幅,因此我们需要对其进行折叠,现在就来为大家分享一个将EMLOG侧边栏二级分类进行折叠和树状展开的效果。
一、操作步骤
1、打开模板文件module.php,大概在第51行找到如下代码
<?php //widget:分类 function widget_sort($title){ global $CACHE; $sort_cache = $CACHE->readCache('sort'); ?> <li> <h3><span><?php echo $title; ?></span></h3> <ul id="blogsort"> <?php foreach($sort_cache as $value): if ($value['pid'] != 0) continue; ?> <li> <a href="<?php echo Url::sort($value['sid']); ?>"><?php echo $value['sortname']; ?>(<?php echo $value['lognum'] ?>)</a> <?php if (!empty($value['children'])): ?> <ul> <?php $children = $value['children']; foreach ($children as $key): $value = $sort_cache[$key]; ?> <li> <a href="<?php echo Url::sort($value['sid']); ?>"><?php echo $value['sortname']; ?>(<?php echo $value['lognum'] ?>)</a> </li> <?php endforeach; ?> </ul> <?php endif; ?> </li> <?php endforeach; ?> </ul> </li> <?php }?>
2、将上面的代码替换为下面的代码即可
<?php //widget:分类 function widget_sort($title){ global $CACHE; $sort_cache = $CACHE->readCache('sort'); ?> <div class="widget m-echo"> <h3><?php echo $title; ?></h3> <ul id="blogsort"> <?php // lognum description foreach($sort_cache as $value): if ($value['pid'] != 0) continue; $Children = ''; $LogNum = $value['lognum']; if (!empty($value['children'])) { $Children .= '<i class="fa"></i><ul>'; foreach ($value['children'] as $sid) { if(isset($GLOBALS['ja_zt']['sort']) && $sort_cache[$sid]['sid'] == $GLOBALS['ja_zt']['sort']) $class = "class=\"ja_sort\" "; else $class = ""; $Children .= '<li><a '. $class .'href="'. Url::sort($sort_cache[$sid]['sid']) .'" title="当前分类下文章 ['.$sort_cache[$sid]['lognum'].'] '.$sort_cache[$sid]['description'].'">'; $Children .= $sort_cache[$sid]['sortname'] .'('. $sort_cache[$sid]['lognum'] .')</a></li> '; $LogNum += $sort_cache[$sid]['lognum']; } $Children .= '</ul>'; } if(isset($GLOBALS['ja_zt']['sort']) && $value['sid'] == $GLOBALS['ja_zt']['sort']) $class = "class=\"ja_sort\" "; else $class = ""; ?> <li> <a <?php echo $class; ?>href="<?php echo Url::sort($value['sid']); ?>" title="当前分类下文章 [<?php echo $value['lognum']; ?>] <?php echo $value['description']; ?>"><?php echo $value['sortname']; ?>(<?php echo $LogNum ?>)</a> <?php echo $Children; ?> </li> <?php endforeach; ?> </ul> <style> #blogsort li:hover .sb { color: #F60 } #blogsort ul li { line-height: 20px; padding: 0 0 5px 8px; margin-bottom: 0; border-bottom: 0 } #blogsort li ul { display: none } #blogsort li:hover ul { display: block }</style> </div> <?php }?>
二、注意事项
1、本教程所使用的样式比较简陋,如果您觉得这样作出来的效果不好看的话,您可以自行编写css样式
2、本教程可以对侧边栏上的标签组件进行折叠,实现将鼠标移到一级分类上会自动展开显示二级分类的效果