试图找出创建一个非常简单(可重用)的WordPress小部件的正确方法.通过wpbeginner发现这篇文章似乎是最全面的:http://goo.gl/7O8Izg
// Creating the widget class wpb_widget extends WP_Widget { function __construct() { parent::__construct( // Base ID of your widget 'wpb_widget', // Widget name will appear in UI __('WPBeginner Widget', 'wpb_widget_domain'), // Widget description array( 'description' => __( 'Sample widget based on WPBeginner Tutorial', 'wpb_widget_domain' ), ) ); } // Creating widget front-end // This is where the action happens public function widget( $args, $instance ) { $title = apply_filters( 'widget_title', $instance['title'] ); // before and after widget arguments are defined by themes echo $args['before_widget']; if ( ! empty( $title ) ) echo $args['before_title'] . $title . $args['after_title']; // This is where you run the code and display the output echo __( 'Hello, World!', 'wpb_widget_domain' ); echo $args['after_widget']; } // Widget Backend public function form( $instance ) { if ( isset( $instance[ 'title' ] ) ) { $title = $instance[ 'title' ]; } else { $title = __( 'New title', 'wpb_widget_domain' ); } // Widget admin form ?>
我的问题是,如何以最恰当的方式包含两个小部件选项及其管理形式值(例如自定义数字/文本及其字体颜色)?
要有多个选项,请从上面的代码更新3个部分1)前端
public function widget( $args, $instance ) { //store the options in variables $option1 = $instance['option1']; $option2 = $instance['option2']; // before widget (defined by theme) echo $args['before_widget']; //use your options //(e.g. a paragraph with option1 as the text and option2 as its class for CSS) //don't forget error/empty content handling/filters echo "<p class='" . $option2 . "'>" . $option1 . "</p>"; // after widget (defined by theme) echo $args['after_widget']; }
2)后端w /表格
// public function form( $instance ) { //Check if option1 exists, if its null, put "new option1" for use in the form if ( isset( $instance[ 'option1' ] ) ) { $option1 = $instance[ 'option1' ]; } else { $option1 = __( 'new option1', 'wpb_widget_domain' ); } //Repeat for option2 if ( isset( $instance[ 'option2' ] ) ) { $option1 = $instance[ 'option2' ]; } else { $option1 = __( 'new option2', 'wpb_widget_domain' ); } <p> <label for="<?php echo $this->get_field_id( 'option1' ); ?>"><?php _e( 'Option1:' ); ?</label> <input class="widefat" id="<?php echo $this->get_field_id( 'option1' ); ?>" name="<?php echo $this->get_field_name( 'option1' ); ?>" type="text" value="<?php echo esc_attr( $option1 ); ?>" /> </p> <p> <label for="<?php echo $this->get_field_id( 'option2' ); ?>"><?php _e( 'Option2:' ); ?</label> <input class="widefat" id="<?php echo $this->get_field_id( 'option2' ); ?>" name="<?php echo $this->get_field_name( 'option2' ); ?>" type="text" value="<?php echo esc_attr( $option2 ); ?>" /> </p>
3)保存新窗口小部件设置的功能
public function update( $new_instance, $old_instance ) { $instance = array(); $instance['option1'] = ( ! empty( $new_instance['option1'] ) ) ? strip_tags( $new_instance['option1'] ) : ''; $instance['option2'] = ( ! empty( $new_instance['option2'] ) ) ? strip_tags( $new_instance['option2'] ) : ''; return $instance; }
基本上,你只需重复正确的事情,并确保你击中所有3个关键领域.希望这可以帮助.