WP酷 WP酷
  • 主题
  • 教程
  • 插件
  • 官方 QQ 群
  • 建站推荐
  • 联系
  • nicetheme® 奈思主题
  • 注册
    登录
立即登录
  • 请到 [后台->外观->菜单] 中设置菜单
首页 › WordPress 开发 › WordPress主题制作教程(八):制作侧边栏sidebar.php

WordPress主题制作教程(八):制作侧边栏sidebar.php

PCDotFan9年前

前面两篇教程讲到了将头部和底部公用的代码提取到单独的一个文件中,同样的道理,对于博客主题来说,侧边栏也基本是公用的(也许有些页面不一样),一般来说我们也将侧边栏公用的代码提取出来放到一个单独的文件中,当然侧边栏的功能不仅仅是这样,有了侧边栏文件,通过代码可以从后台往侧边栏添加小工具。

在主题文件夹wp-content/themes/Aurelius中新建一个sidebar.php文件,然后用编辑器打开index.php文件将里面的侧边栏代码剪切出来,粘贴到sidebar.php中,侧边栏代码如下:

<!-- Column 2 / Sidebar -->   
    <div class="grid_4">   
        <h4>Catagories</h4>   
        <ul class="sidebar">   
            <li><a href="">So who are we?</a></li>   
            <li><a href="">Philosophy</a></li>   
            <li><a href="">History</a></li>   
            <li><a href="">Jobs</a></li>   
            <li><a href="">Staff</a></li>   
            <li><a href="">Clients</a></li>   
        </ul>   
        <h4>Archives</h4>   
        <ul class="sidebar">   
            <li><a href="">January 2010</a></li>   
            <li><a href="">December 2009</a></li>   
            <li><a href="">Novemeber 2009</a></li>   
            <li><a href="">October 2009</a></li>   
            <li><a href="">September 2009</a></li>   
            <li><a href="">August 2009</a></li>   
        </ul>   
    </div>   
    <div class="hr grid_12 clearfix">&nbsp;</div>  

 剪切之后,在index.php原来剪切此内容的位置加上代码:

<?php get_sidebar(); ?>  

可以看到这个函数跟获取头部、底部函数灰常相似。get_sidebar()函数会加载sidebar.php文件,不过get_sidebar()函数是可以加参数的。
比如:<?php get_sidebar(1); ?>  

这个代码加载sidebar-1.php,有的人希望网站上的首页、内页、分类页等各个页面的侧边栏不一样,这样就需要有多个侧边栏,这时候就得给这个函数加参数了,具体可查阅官方文档。

编辑sidebar.php文件,将里面的代码删除,改成:

<!-- Column 2 / Sidebar -->   
   <div class="grid_4">   
          
   <?php if ( !function_exists('dynamic_sidebar')    
                       || !dynamic_sidebar('First_sidebar') ) : ?>   
       <h4>分类目录</h4>   
       <ul>   
           <?php wp_list_categories('depth=1&title_li=&orderby=id&show_count=0&hide_empty=1&child_of=0'); ?>   
       </ul>   
   <?php endif; ?>   
          
   <?php if ( !function_exists('dynamic_sidebar')    
                           || !dynamic_sidebar('Second_sidebar') ) : ?>           
       <h4>最新文章</h4>   
       <ul>   
           <?php   
               $posts = get_posts('numberposts=6&orderby=post_date');   
               foreach($posts as $post) {   
                   setup_postdata($post);   
                   echo '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a></li>';   
               }   
               $post = $posts[0];   
           ?>   
       </ul>   
   <?php endif; ?>   
      
   <?php if ( !function_exists('dynamic_sidebar')    
                           || !dynamic_sidebar('Third_sidebar') ) : ?>    
       <h4>标签云</h4>   
       <p><?php wp_tag_cloud('smallest=8&largest=22'); ?></p>   
   <?php endif; ?>   
          
   <?php if ( !function_exists('dynamic_sidebar')    
                       || !dynamic_sidebar('Fourth_sidebar') ) : ?>                       
       <h4>文章存档</h4>   
       <ul>   
           <?php wp_get_archives('limit=10'); ?>   
       </ul>   
   <?php endif; ?>   
      
   </div>   
   <div class="hr grid_12 clearfix">&nbsp;</div>  

仅仅有代码是不够的,还需要函数支持,现在在主题文件夹下面新建一个文件functions.php 用于存放函数代码,新建后添加以下代码:

<?php
/** widgets */
if( function_exists('register_sidebar') ) {
	register_sidebar(array(
		'name' => 'First_sidebar',
		'before_widget' => '',
		'after_widget' => '',
		'before_title' => '<h4>',
		'after_title' => '</h4>'
	));
	register_sidebar(array(
		'name' => 'Second_sidebar',
		'before_widget' => '',
		'after_widget' => '',
		'before_title' => '<h4>',
		'after_title' => '</h4>'
	));
	register_sidebar(array(
		'name' => 'Third_sidebar',
		'before_widget' => '',
		'after_widget' => '',
		'before_title' => '<h4>',
		'after_title' => '</h4>'
	));
	register_sidebar(array(
		'name' => 'Fourth_sidebar',
		'before_widget' => '',
		'after_widget' => '',
		'before_title' => '<h4>',
		'after_title' => '</h4>'
	));
}
?>

 

2
分享

本站下载管理系统「dl.mywpku.com」因年久失修而永久关闭。若需获得往年主题,请至 WP酷的百度网盘(提取码: 5rbm) 自行搜索下载。默认解压密码为「www.mywpku.com」。

对您造成的不便,敬请谅解!

PCDotFan 站长
文章 435评论 859
相关文章
  • 移除 WordPress 中的「找回密码」功能
  • WordPress 实现添加角色与更改角色名称
  • WordPress 4.1 中新的主题函数
  • 借助Github – 为WordPress插件添加自动更新功能
  • WordPress进阶教程(一):WordPress文章类型
  • WordPress进阶教程:前言
  • WordPress主题制作函数全攻略
  • WordPress主题制作教程(十二):单页面模板page.php
评论 (3)
再想想
  • 兔子酱

    学习了哦

    9年前
  • 刘俊皓

    7年前
  • 康希玲

    HOHO~~~~~~

    7年前
PCDotFan
站长
若无特别注明,则默认我发布的所有文章均为内容原创 / 翻译原创,转载时请保留来源。
435文章
859评论
3K获赞
猜你喜欢
MP6 – WordPress后台美化插件
10年前
利用缓存插件W3TC与又拍云构建WordPress全站CDN
10年前
ZiPE – 银灰质感Blog主题
10年前
  • 杂记
  • WordPress 付费主题推荐
Copyright © 2023 WP酷. Designed by nicetheme. 琼ICP备13002067号-1