wordpress appearance widgets 侧边栏 详解

张映 发表于 2013-09-02

分类目录: wordpress

标签:, , ,

wordpress自带的,widgets功能还是很强大的,它能帮助我们实现侧边栏的完全定制。

一,修改主题下的functions.php,添加一个新的侧边栏

function sidebar_widgets_init() {

    register_sidebar( array(
        'name' => __( 'Primary Widget Area', 'twentyten' ),
        'id' => 'primary-widget-area',
        'description' => __( 'The primary widget area', 'twentyten' ),
        'before_widget' => '<li id="%1$s">',
        'after_widget' => '</li>',
        'before_title' => '<h3>',
        'after_title' => '</h3>',
    ) );

    register_sidebar( array(
        'name' => __( 'Test Widget Area', 'twentyten' ),
        'id' => 'test-widget-area',
        'description' => __( 'The test widget area', 'twentyten' ),
        'before_widget' => '<li id="%1$s">',
        'after_widget' => '</li>',
        'before_title' => '<h3>',
        'after_title' => '</h3>',
    ) );

}

add_action( 'widgets_init', 'sidebar_widgets_init' );

如果下图:

widget

widget

这样就会产生,一个新sidebar,不同的页面显示不同的sidebar,也可以同一个页面显示,多个sidebar。

二,往新增的Test Widget Area,添加widget,从左边的widget例表中拖动到Test Widget Area就行了。地址是http://localhost/wp-admin/widgets.php

三,在主题下的sidebar.php中,调用Test Widget Area

<?php

    if ( is_active_sidebar( 'test-widget-area' ) ) : ?>

        <div id="test" role="complementary">
            <ul>
                <?php dynamic_sidebar( 'test-widget-area' ); ?>
            </ul>
        </div>

<?php endif; ?>

这样在前台就显示,新增的Test Widget Area侧边栏了。有的时候,默认的widget,并不能满足我们的需求,这个时候,我们就要自定义widget了。

四,如何增加widget,小工具

修改wp-includes/default-widgets.php

class WP_Test_Menu_Widget extends WP_Widget {

    function __construct() { //定义一个widget
        $widget_ops = array( 'description' => __('Use this widget to add one of your custom menus as a widget.') );
        parent::__construct( 'test_menu', __('Test Menu'), $widget_ops );
    }

    function widget($args, $instance) {  //这个方法是供前台调用显示
        。。。。。。。。。。。。。。
    }

    function update( $new_instance, $old_instance ) { //这个方法是供后台,保存数据用的
        。。。。。。。。。。。。。。。。。。。。
    }

    function form( $instance ) {//这个方法是在后台显示这个widget,拖动后
        。。。。。。。。。。。。。。。。。
    }
}
add widget

add widget

这样就新增了一个widget



转载请注明
作者:海底苍鹰
地址:http://blog.51yip.com/wordpress/1555.html