走进wordpress的侧边栏世界

wordpress程序的出现,使得建立一个网站的难度大大降低,我也不止一次对wordpress的易用性表示赞赏。但话又说回来,容易与困难总是相伴而生的,尤其是对于wordpress这个折腾货来讲,刚刚接触的话,用起来还是有些难度。

在WP中文论坛里逛久了,就能发现,每天都有很多人在提问很多非常“菜鸟”的问题,如何修改标题的显示,如何修改导航栏,如何修改logo图片,如何修改友情链接从单栏变成双栏。最开始的时候,我还很热心的去帮助他们解决这些问题,但现在却已经失去了那种热情,任谁每天面对这些千篇一律的问题都会烦躁的。

这样讲并不是有歧视菜鸟的意思,因为大家都是从菜鸟走过来的。想表达的核心意思有两个,一是wordpress开发团队能不能让其易用性再上升一个台阶;二是如果打算用wordpress建立网站,能不能先学习一下最基本的操作,度娘和谷歌不利用起来就是最大的浪费。

这个前言有点长了,言归正传,下面我们来一起走进wordpress侧边栏的世界。

多数wordpress主题都是包括侧边栏的,单栏主题请无视;侧边栏,在wordpress主题文件中称为sidebar,主要是用来存放各种各样的小工具的(widget);在页面中的布局以前是位于整个网页的左侧或者右侧,所以才有了侧边栏的称呼,但现在也有在网页底部存放widget的布局趋势,这个无关紧要,侧边栏的本质并没有发生变化。

下面我们从代码的角度来认识一下侧边栏。用你熟悉的编码器,比如editplus或者notepad++,打开主题文件夹里的sidebar.php文件,一般而言这个文件就是定义侧边栏的文件啦。下面是我写的一个sidebar代码范例,仅注册了一个侧边栏,其id为 Primary Widget Area,你看到的sidebar.php内容肯定和我的不一样,但是基本架构都是一样的,都会包含一个或者多个if条件判断语句,这个语句就是wordpress侧边栏实现其功能的核心代码。

<aside id="sidebar">
	<div id="primary" class="widget-area">
		<ul class="sidebar">
		<?php if (!function_exists('dynamic_sidebar')||!dynamic_sidebar('Primary Widget Area') ):?> 
		<?php endif; ?>       
		</ul>
	</div> 
</aside>

为了更好的理解侧边栏代码的结构,我做了如下的图片,大家可以结合图片进行思考。

第6行至第10行的代码为sidebar核心代码,其中6行和7行是一个if判断语句,它的含义很简单,就是说如果你没有在wordpress的后台向侧边栏里面拖放任何的小工具,那么就执行2号代码位里的代码。一般wordpress主题的作者都喜欢在2号代码位放置一些默认的侧边栏小代码,比如搜索框、近期文章什么的,这样做的目的,就是当你没有往侧边栏拖放小工具的时候,侧边栏里还有东西显示,不至于显得光秃秃的。

我们上面讲了,如果后台没有拖拽小工具的时候,默认执行2号代码位的代码;那么如果在后台拖拽了小工具呢?很简单,2号代码位的代码就被隐藏起来了,不会在网页上显示。这就是if判断语句的作用和特色。

下面我们讲一下,1号代码位和3号代码位有什么作用。这个就是比较好玩儿的事情了。wordpress后台默认有大概十几个小工具,但我们仍然觉得不够用怎么办?比如最新评论的格式是xx发表在《xxx》上的评论,显示不出来评论的内容;比如没有热门文章小工具,没有随机文章小工具,没有读者墙小工具;比如没有方便的插入广告位的小工具。

出现上述情况怎么办?解决办法就是咱们自己向sidebar.php里面插入代码,代码的具体内容不是本文讨论的内容,大家可以在网上搜索到很多这种代码。咱们要讲的是,代码(以随机文章代码为例)应该插入到什么位置,才能完美的显示出来。聪明的基友肯定已经明白我的意思了,对的,就是要插入到1号代码位或者3号代码位里面去。

1号和3号代码位最大的特点是,无论你在后台有没有向侧栏拖拽小工具,放在这两个位置的代码都会显示出来,不会受到任何影响。

ok,就讲这些吧。觉得内容很菜的基友请无视,觉得内容对你有点帮助的可以点一下广告。


26 comments

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

Time limit is exhausted. Please reload CAPTCHA.