WordPress主题教程 :侧边栏

第三部分,关于侧边栏。侧边栏有一个特点,就是又臭又长,当然了这不是什么缠脚布。先不要乱扯。因为地形有限,所以侧边栏里的内容,多以列表的形式 排开。下面欢迎一对父子出场,他们的感情是相当的好,从来都是父子不分家,有父必有子,有子必有父,父中有子,子中有父。他们就是<UL>和<LI>!!!!!!!

<div class=”sidebar”><!–注意这里使用的不是id–>

<ul>

<li>

<h2><?php _e(‘日志分类”); ?></h2>

</li>

</ul>

</div>

UL 表示无序列表,OL 表示列表元素。在侧边栏里,你要有几个不同的栏目,栏目的存在,就是为侧边栏进行了分类整理。每一个栏目又要有不同的分类列表,继续为上面的代码添加内容。

<div class=”sidebar”>

<ul>

<li><h2><?php _e(‘日志分类’); ?></h2> <ul>

<?php wp_list_cats

(‘sort_column=name&optioncount=1&hierarchical=0’); ?>

</ul>

</li>

</ul>

</div>

wp_list_cats() 函数为调用日志分类列表,它的参数也有三个。每个参数之间用&来分隔。

sort_column=name — 把分类按字符顺序排列 optioncount=1 — 显示在每个分类下面的日志数 hierarchial=0 — 不把子分类放到子列表条目中

说到分类,特别说一下静态页面这个栏目。我们在WP后台撰写的时候,有二个选择,一个是撰写日志,一个是撰写页面。对于日志,还可以选择保存在哪一 个具体的分类下面。对于页面就没得选择,只收录于页面栏目之下。 再回到前台,你可以看到每个分类都有显示日志的数目,而不显示标题。在页面栏目里,只排列了每一个页面的标题,而不显示数目。

<?php wp_list_pages(‘depth=3&title_li=”<h2>页面</h2>”‘); ?>

参数depht=3为可选参数,表示可以设定显示三级列表。

注意一点,本教程的代码是制作模版的代码(PHP 代码),在WP中使用一个主题也就是等于在套用一个模版。在网站中查看源代码是看不到模版的代码的(已经被解释

  • HTML 代码)。

<li><h2><?php _e(‘日志分类’); ?</h2>

<ul>

<?php wp_list_cats

(‘sort_column=name&optioncount=1&hierarchical=0’); ?>

</ul>

</li>

上面这一段模版代码,在网页中查看源代码,实际上显示的是这样的:

<li><h2>文章存档</h2>

<ul>

<li><a href=”#”>与爱情有关的分类贴子</a></li> <li><a href=”#”>与生活有关的分类贴子</a></li>

…………………………. </ul>

</li>

增加一个存档栏目:

<li><h2><?php _e(‘文章存档’); ?></h2> <ul>

<?php wp_get_archives(‘type=monthly’); ?>

</ul>

</li>

wp_get_archives() 函数是用来获取文章存档的,参数’type=monthly’定义为以每个月的时间来进行分类存档

增加一个友情链接栏目:

<?php get_links_list(); ?>

不用担心没有实际内容,它会自动调用在 WP 后台中添加的友情链接。

增加一个搜索栏目:

<li id=”search”>

<?php include(TEMPLATEPATH. ‘/searchform.php’); ?> </li>

这里使用 include() 函数调用一个文件,参数 TEMPLATEPATH 为主题文件夹路径,为了调用成功,你还需要有一个文件:searchform.php。

增加一个日历栏目:

<li id=”calendar”>

<h2><?php _e(‘日历’); ?></h2>

<?php get_calendar(); ?>

</li>

这里就不用多废话了。

增加一个管理栏目:

<li>

<h2><?php _e(‘管理’); ?></h2>

<ul>

<?php wp_register(); ?>

<li>

<?php wp_loginout(); ?>

</li>

<?php wp_meta(); ?>

</ul>

</li>

wp_loginout() 来确定你是否登陆,如果登陆就显示登出链接,如果没有登陆,就显示登陆的链接。

wp_register() 来确定你的身份,如果没有登陆,就显示注册的链接,如果有的话,就显示管理的链接。

而wp_meta() 却是什么也没有做。也不用去理它,还没有人来说明它是起什么作用的。实际上它是 WordPress 的hook。

窗体化侧边栏

<?php /* Widgetized sidebar, if you have the plugin installed. */

if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar() ) : ?>

在侧边栏开始的地方第一个<ul>的后面,加上以上代码。也要在侧边栏结束的地方</ul>前面加上一句

<?php endif; ?>

  • WP2.0 开始,已经在后台集成了一个侧边栏的插件--Widget,它的功能就是可以很方便的在WP后台调整侧边栏中的内容,直接使用鼠标就可以移动每一个栏目的位置,而不需要去修改相应的代码。让每一个栏目都以窗体化存在。

function_exists(‘dynamic_sidebar’) || !dynamic_sidebar()) 这两个参数来自于一个新的文件 — functions.php 我们需要创建这个文件才可以完成侧边栏的窗体化.。

通过观察不同的WP主题,会发现在侧边栏中的内容远不止以上所列举的,要在学习中举一反三,才会制作出更加出众的主题。

至此,侧边栏中的内容结束,我们也可以把第三部分的代码另存为一个新的文件 — sidebar.php,在index.php中填加一句代码就可以使用侧边栏

<?php get_sidebar(); ?>

顺便再增加一行代码:

<?php get_footer();?>

这是调用尾部文件 footer.php 的代码。我想你应该知道如何处理一个简单的 PHP 文件了,要么你就再重头学一次本教程。

再一次查看一下index.php有了哪些代码

<?php get_header(); ?>

<div id=”content”>

<?php if(have_posts()) : ?>

<?php while(have_posts()) : the_post(); ?> <div class=”post”>

<h2><a href=”<?php%20the_permalink();?>”><?php the_title();?></a></h2> <div class=”entry”>

<?php the_content();?>

<p class=”postmetadata”>

<?php _e(‘Filed under:’);?>

<?php the_category(‘,’);?>

<?php _e(‘by’);?>

<?php the_autnor(”);?>

<br />

<?php comments_poopup_link(‘No Comments?’,’1 Comments?’,’% Comment?’);?>

<?php edit_post_link(‘Edit’,’|’,”);?> </p>

</div>

</div>

<?php endwhile; ?>

<div class=”navigation”>

<?php posts_nav_link(); ?>

</div>

<?php else:?>

<div class=”post” id=”post-<?php the_ID(); ?>” > <?php _e(‘Not Found’);?> </div>

<?php endif; ?>

</div>

<?php get_sidebar(); ?>

<?php get_footer();?>

index.php 文件的代码已经全在这里了,但是只有第二部分内容需要详细的代码,而其它的部分我们都可以调用外部文件,至此一个 WP 的主题构造已经搭建好,再一次提醒各位,检查代码,确认书写正确。只有不厌其烦地写代码才会对代码有更深刻的印像。

发表评论

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