实现WordPress主题侧边栏切换功能的PHP脚本详解

php  /  管理员 发布于 7年前   216

作为主题的制作者, 除了实现功能, 展示界面, 还有责任使主题灵活多变, 以满足更多人不同的需求.
可能一些朋友曾为选用双栏主题 (单侧边栏) 还是三栏主题 (双侧边栏) 而烦恼过. 下面我们以 Classic 主题为例, 谈谈如何在主题中方便地切换单侧边栏和双侧边栏. 最后我会提供修改后的主题.

添加管理选项
后台处理
首先, 我们要修改 function.php, 主要的处理工作都在这个文件里面, 如果主题没有这个文件, 就创建一个吧. (没有 function.php 说明主题不支持 Widget, 可不是一个好习惯哦, 还是赶紧新建一个吧）
我的处理包括 3 大块: 获取选项, 初始化, 标签页操作界面. 这里只创建一个公告栏, 包括两个选项 (是否显示公告栏和公告栏内容). 如果要添加更多选项, 也只需要代码中 3 个 TODO 的位置上追加一些代码而已. 当然, 你还需要改一下选项名称, 将 Classic 和 classic 全部之换掉.

 
 
 
   
  
  
   
      
      
   
           />          
          <?php echo($options['notice_content']); ?>      
  
  
 
     
   
   

前台处理

要公告栏在首页上显示, 需要修改一下 index.php, 这个比较简单, 只是通过一些判断语句决定东西要不要显示出来而已. 当然, 你可以进行其他操作, 关键是获取到选项的值, 并对它们进行处理.
其实可以分为两步:

获取选项 (对每个 PHP 文件, 获取一次就行了, 可以在文件顶部执行)
对选项进行处理 (这里判断成立的话就将公告内容显示出来)

可以使用管理项来控制侧边栏的数量, 在主题文件中获取侧边栏的数量, 对不同的数量作出不同的处理, 以达到在不同数量侧边栏之间切换的目的.

// 侧边栏数量, 默认为单侧边栏$options['sidebar'] = 1;// 获得最新提交的值$options['sidebar'] = $_POST['sidebar'];  >  > .

添加 Widget 支持

因为要在单侧边栏和双侧边栏中切换, 所以我们需要对不同的两种模式定义两个 Widget 初始化的分支.
这里比较特殊, 为了在代码中正确获取 Widget 信息, 就算是单侧边栏也需要起一个别名. 就像代码中的 Sidebar_single. 当侧边栏个数为 1 时, 登记 Sidebar_single. 当侧边栏个数为 2 时, 登记 Sidebar_top 和 Sidebar_bottom.

// Widgets$options = get_option('classic_options'); // 单侧边栏if(function_exists('register_sidebar') && $options['sidebar'] == 1) { register_sidebar(array( 'name' => 'Sidebar_single', 'before_widget' => '
', 'after_widget' => '
', 'before_title' => '
', 'after_title' => '
' )); // 双侧边栏} else if(function_exists('register_sidebar') && $options['sidebar'] == 2) { register_sidebar(array(  'name' => 'Sidebar_bottom',  'before_widget' => '
',  'after_widget' => '
',  'before_title' => '
',  'after_title' => '
' )); register_sidebar(array(  'name' => 'Sidebar_top',  'before_widget' => '
',  'after_widget' => '
',  'before_title' => '
',  'after_title' => '
' ));}

修改侧边栏结构

首先要明确, 我们现在需要双侧边栏结构. 怎样将双侧边栏变为单侧边栏呢? 只要将前一个侧边栏的结束标签和后一个侧边栏的开始标签删除, 两个侧边栏就合并为一个侧边栏了. 单纯的文字很难将我的想法和实现表达出来, 你可以接着看下面的代码和示例图片.

      = 2) : ?>
      

OK, 这就是侧边栏代码结构了. 它可以完美得实现单双侧边栏间的切换. 但它是怎么工作的呢? 我将在后面用图片列出它的 6 种可能出现的状态.
因为主题已经支持 Widget 了, 所以代码中 function_exists('dynamic_sidebar') === true, 则 !function_exists('dynamic_sidebar') === false.
记得添加 Widget 支持时写的代码吗? 侧边栏为 1 时 sidebar_single 有效, 侧边栏为 2 时, sidebar_top 和 sidebar_bottom 有效. 这是贯穿整个思路的关键.

备注:

• 红色: 表示选中代码的值是 false, 不通过
• 绿色: 表示选中代码的值是 true, 通过
• 蓝色: 表示选中部分将被选用的 widgets 所取代
• 灰色: 表示选中部分代码将会失效

状态一: 单侧边栏, 没使用 Widget

状态二:双侧边栏, 没使用 Widget

状态三: 单侧边栏, 使用 Widget

状态四: 双侧边栏, 顶部侧边栏使用 Widget

状态五: 双侧边栏, 底部侧边栏使用 Widget

状态六: 双侧边栏, 顶部和底部侧边栏都使用 Widget

您可能感兴趣的文章:

• WordPress主题制作中自定义头部的相关PHP函数解析
• WordPress主题制作之模板文件的引入方法
• WordPress的主题编写中获取头部模板和底部模板
• WordPress主题中添加文章列表页页码导航的PHP代码实例
• WordPress中使主题支持小工具以及添加插件启用函数
• 编写PHP脚本使WordPress的主题支持Widget侧边栏
• WordPress中编写自定义存储字段的相关PHP函数解析
• WordPress中给文章添加自定义字段及后台编辑功能区域
• 在WordPress中获取数据库字段内容和添加主题设置菜单