zoukankan      html  css  js  c++  java
  • 如何使WordPress博客添加多个sidebar侧边栏

    制作wordpress模版的时候,也许你会遇到一个sidebar侧栏不能完全满足你的需求,或者侧栏内容过多导致页面过长,那么我们可以考虑使用两个或者更多侧栏。

    考虑到需要修改functions.php和sidebar.php文件,因此开始前备份好文件以防万一。
    首先看functions.php文件。文件里有一段代码的开始部分是这样的:

    <?php if ( function_exists('register_sidebar') )

    删除这段代码以及相应的闭合括号,之后加入下面的内容:

    <?php if ( function_exists('register_sidebar') )
    register_sidebar(array('name'=>'sidebar1',
    'before_widget' => '',
    'after_widget' => '',
    'before_title' => '<h2>',
    'after_title' => '</h2>',
    ));
    ?>

    这是一个侧栏的对应代码,如果我们要的是两个侧栏效果,那么就再加入一段侧栏代码,变成:

    <?php if ( function_exists('register_sidebar') )
    register_sidebar(array('name'=>'sidebar1',
    'before_widget' => '',
    'after_widget' => '',
    'before_title' => '<h2>',
    'after_title' => '</h2>',
    ));
    register_sidebar(array('name'=>'sidebar2',
    'before_widget' => '',
    'after_widget' => '',
    'before_title' => '<h2>',
    'after_title' => '</h2>',
    ));
    ?>

    如果想多显示几个侧栏,只要复制同样的代码段,把其中的sidebar1/2后面的数字改动一下就可以了。
    注册好必需的侧栏之后,wp-admin的wiget里就有了三个widget盒,之后我们需要激活侧栏,让它能够显示在博客前端。
    打开sidebar.php文件之后你会看见一行这样的代码:

    <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebarname') ) : ?>
    <?php endif; ?>

    删除之,然后加上:

    if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar1') ) : ?>
    <?php endif; ?>

    以上代码使sidebar1显示在博客前端。要同时显示sidebar1和sidebar2,则加入:

    <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar1') ) : ?>
    <?php endif; ?>
     
    <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar2') ) : ?>
    <?php endif; ?>

    以此类推,要显示sidebar345,请添加同样代码,将其中的数字略作改动即可。
    大功告成。
    注意:修改functions.php文件时请注意删除多余的闭合括号或空格等。

  • 相关阅读:
    使用Spring Boot来加速Java web项目的开发
    Spring IOC的理解
    CentOS查看系统信息-CentOS查看命令
    mybatis传递Map和List集合示例
    java文件读写工具类
    MongoDB数据库操作
    linux中给PHP安装mongodb的扩展
    深度学习与计算机视觉系列(2)_图像分类与KNN
    深度学习与计算机视觉系列(3)_线性SVM与SoftMax分类器
    深度学习与计算机视觉系列(6)_神经网络结构与神经元激励函数
  • 原文地址:https://www.cnblogs.com/lydbk/p/4609736.html
Copyright © 2011-2022 走看看