网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的范文:

 

标题 非插件实现Wordpress分类两列显示
范文
    一般来说,分类都是侧边显示的,如果分类的名称字符比较少的时候,而且分类比较多,我们会看到一排分类用户体验不是太好。我们想是不是可以两列显示分类,这样还饱满一些。我们可以通过插件实现,但是我比较推荐使用非插件实现WP的功能,因为插件装多了WP耗内存非常的厉害。
    首先,我们先确定自己的分类是手工在sidebar.php模板手工添加的,还是通过小工具拖动的。
    如果是手工添加的就好办了,我们对于定义的ID和CLASS属性自己掌控。比如:
    <h3>网站分类</h3>
    <div id="side-categories">
    <ul>
    <?php wp_list_cats('sort_column=ID&sort_order=asc&optioncount=1&depth=2&hierarchical=0&exclude=1'); ?>
    </ul>
    </div>
    然后我们分别给予side-categories和categories定义CSS
    #side-categories { position: relative; width: 250px; overflow: hidden; margin: 8px auto 0; }
    #sidebar .categories{ line-height: 20px; }
    #side-categories ul {display: block; overflow: auto; }
    #side-categories li {width: 120px; float: left;}
    其次,如果我们是通过小工具拖动实现的,这就需要我们到代码中看下分类部分的ID和CLASS名称。
    如果,我这边看到的id=categories-2;class=widget widget_categories然后我就来定义CSS,如下:
    #categories-2 { position: relative; width: 245px; overflow: hidden; margin: 8px auto 0; }
    #sidebar widget widget_categories{ line-height: 20px; }
    #categories-2 ul {display: block; overflow: auto; }
    #categories-2 li {width: 122px; float: left;}
    看下是不是可以实现分类两列的效果。
随便看

 

在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板,是学习及工作的有利工具。

 

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间:2025/5/21 1:05:56