我想创建一个自定义小部件,以便用户可以通过下拉框从媒体库中选择2个图像,并将它们显示在侧栏中。
因此,我需要小部件显示2个下拉列表,每个下拉列表显示媒体库中图像的标题。
然后我需要保存这两个图像的url,以便在前端使用(标记为<?php $IMAGEVAR ?>
在widget
作用
这是我的小部件模板->
<?php
class Image_Picker extends WP_Widget
{
function Image_Picker() {
$widget_ops = array(\'classname\' => \'Image_Picker\', \'description\' => \'Pick 2 images from media library\');
$this->WP_Widget(\'Image_Picker\', \'Image Picker\', $widget_ops);
}
function form() {
//WIDGET BACK-END SETTINGS
echo \'<select name="link1">\';
echo \'<option value="image1" selected>Image 1 Title</option>\';
echo \'<option value="image2">Image 2 Title</option>\';
echo \'<option value="image3">Image 3 Title</option>\';
echo \'</select><br>\';
echo \'<select name="link2">\';
echo \'<option value="image1" selected>Image 1 Title</option>\';
echo \'<option value="image2">Image 2 Title</option>\';
echo \'<option value="image3">Image 3 Title</option>\';
echo \'</select>\';
}
function update() {
//WIDGET SAVE FUNCTION
}
function widget() {
//WIDGET FRONT-END VIEW
?>
<!-- Display images -->
<div class="sidebar-image"><img src="<?php $IMAGEVAR ?>" alt="" width="203" height="271" border="0"></div>
<div class="sidebar-image"><img src="<?php $IMAGEVAR ?>" alt="" width="177" height="207" border="0"></div>
<?php
}
}
// Add class for Random Posts Widget
add_action( \'widgets_init\', create_function(\'\', \'return register_widget("Image_Picker");\') );
?>
我一直在做文章的元框,但我需要制作一个小部件版本,无法解决如何实现它。我添加了一个前端模板来说明它是如何作为一个小部件工作的,如果您将其包含在
functions.php
, 但很明显它什么都做不了。。。
非常感谢您的帮助,干杯。
最合适的回答,由SO网友:Joshua Abenazer 整理而成
Try this code.
class Image_Picker extends WP_Widget
{
function Image_Picker() {
$widget_ops = array(\'classname\' => \'Image_Picker\', \'description\' => \'Pick 2 images from media library\');
$this->WP_Widget(\'Image_Picker\', \'Image Picker\', $widget_ops);
}
function form($instance) {
//WIDGET BACK-END SETTINGS
$instance = wp_parse_args((array) $instance, array(\'link1\' => \'\', \'link2\' => \'\'));
$link1 = $instance[\'link1\'];
$link2 = $instance[\'link2\'];
$images = new WP_Query( array( \'post_type\' => \'attachment\', \'post_status\' => \'inherit\', \'post_mime_type\' => \'image\' , \'posts_per_page\' => -1 ) );
if( $images->have_posts() ){
$options = array();
for( $i = 0; $i < 2; $i++ ) {
$options[$i] = \'\';
while( $images->have_posts() ) {
$images->the_post();
$img_src = wp_get_attachment_image_src(get_the_ID());
$the_link = ( $i == 0 ) ? $link1 : $link2;
$options[$i] .= \'<option value="\' . $img_src[0] . \'" \' . selected( $the_link, $img_src[0], false ) . \'>\' . get_the_title() . \'</option>\';
}
} ?>
<select name="<?php echo $this->get_field_name( \'link1\' ); ?>"><?php echo $options[0]; ?></select>
<select name="<?php echo $this->get_field_name( \'link2\' ); ?>"><?php echo $options[1]; ?></select><?php
} else {
echo \'There are no images in the media library. Click <a href="\' . admin_url(\'/media-new.php\') . \'" title="Add Images">here</a> to add some images\';
}
}
function update($new_instance, $old_instance) {
$instance = $old_instance;
$instance[\'link1\'] = $new_instance[\'link1\'];
$instance[\'link2\'] = $new_instance[\'link2\'];
return $instance;
}
function widget($args, $instance) {
$link1 = ( empty($instance[\'link1\']) ) ? 0 : $instance[\'link1\'];
$link2 = ( empty($instance[\'link2\']) ) ? 0 : $instance[\'link2\']; ?>
<!-- Display images --><?php
if( !( $link1 || $link2 ) ) {
echo "Please configure this widget.";
} else {
if($link1) { ?><div class="sidebar-image"><img src="<?php echo $link1; ?>" alt="" width="203" height="271" border="0"></div><?php }
if($link1) { ?><div class="sidebar-image"><img src="<?php echo $link2; ?>" alt="" width="177" height="207" border="0"></div><?php }
}
}
}
// Add class for Random Posts Widget
add_action( \'widgets_init\', create_function(\'\', \'return register_widget("Image_Picker");\') );