网站导航免费论文 原创论文 论文搜索 原创论文 网学软件 学术大家 资料中心 会员中心 问题解答 原创论文 大学论文导航 设计下载 最新论文 下载排行 原创论文 论文源代码
返回网学首页
网学联系
最新论文 推荐专题 热门论文 素材专题
当前位置: 网学 > 编程文档 > 网络知识 > 正文

非插件实现Wordpress分类两列显示

来源:http://myeducs.cn 联系QQ:点击这里给我发消息 作者: 用户投稿 来源: 网络 发布时间: 14/06/29

网学网为广大网友收集整理了,非插件实现Wordpress分类两列显示,希望对大家有所帮助!

  一般来说,分类都是侧边显示的,如果分类的名称字符比较少的时候,而且分类比较多,我们会看到一排分类用户体验不是太好。我们想是不是可以两列显示分类,这样还饱满一些。我们可以通过插件实现,但是我比较推荐使用非插件实现WP的功能,因为插件装多了WP耗内存非常的厉害。

  首先,我们先确定自己的分类是手工在sidebar.php模板手工添加的,还是通过小工具拖动的。

  如果是手工添加的就好办了,我们对于定义的ID和CLASS属性自己掌控。比如:

<h3>网站分类</h3>
<div id="side-categories" class="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;}

  看下是不是可以实现分类两列的效果。

  原文地址:/uploadfile/201406/29/8013945127.gif'' class=''ext'' border=''0''>

界面预览

  • 软件大小:6.28MB
  • 软件类别:国外软件 | 博客系统
  • 软件语言:简体中文
  • 运行环境:PHP/Mysql
  • 软件授权:免费版
  • 更新时间:2013-7-24 16:05:30
  • 相关链接:Home Page

  • 下一篇资讯: wordpress菜单名称重命名
  • 网学推荐

    免费论文

    原创论文

    设为首页 | 加入收藏 | 论文首页 | 论文专题 | 设计下载 | 网学软件 | 论文模板 | 论文资源 | 程序设计 | 关于网学 | 站内搜索 | 网学留言 | 友情链接 | 资料中心
    版权所有 QQ:3710167 邮箱:3710167@qq.com 网学网 [Myeducs.cn] 您电脑的分辨率是 像素
    Copyright 2008-2015 myeducs.Cn www.myeducs.Cn All Rights Reserved 湘ICP备09003080号