Create a simple widget

时间:2013-01-19 作者:RogerNobrega

我想创建一个简单的小部件,显示带有链接的图像和文本。类似这样:

http://jsfiddle.net/aF4UR/

但我想将其作为一个带有字段的小部件包含在内。

例如,在后端:

图像:[在此处插入图像url]图像链接[链接]标题:[在此处插入链接]标题链接:[在此处插入链接]文本:[文本字段]

并在前端显示为JSFIDLE中的代码。

有什么帮助吗?

1 个回复
最合适的回答,由SO网友:Rafael Marques 整理而成

正确的问题是“如何创建小部件”?未启动任何代码。我建议阅读本教程:Building Custom Wordpress Widgets

无论如何您的小部件:

class widget_simple extends WP_Widget {

    // Create Widget
    function widget_simple() {
        parent::WP_Widget(false, $name = \'Custom Simple Widget\', array(\'description\' => \'\'));
    }

    // Widget Content
    function widget($args, $instance) { 
        extract( $args );
        $simple_image_url = strip_tags($instance[\'simple_image_url\']);
        $simple_image_link = strip_tags($instance[\'simple_image_link\']);
        $simple_title = strip_tags($instance[\'simple_title\']);
        $simple_title_link = strip_tags($instance[\'simple_title_link\']);
        $simple_text = strip_tags($instance[\'simple_text\']);

        ?>

            <div id="latest-box">

                <span class="img-box">
                    <a href="<?php echo $simple_image_link; ?>"><img src="<?php echo $simple_image_url; ?>"></a>
                </span> <!-- img-box -->

                <span class="latest-title">
                    <a href="<?php echo $simple_title_link; ?>"><?php echo $simple_title; ?></a>
                </span> <!-- title -->

                <span class="latest-text">
                    <?php echo $simple_text; ?>
                </span> <!-- text -->

            </div> <!-- box -->

        <?php
     }

    // Update and save the widget
    function update($new_instance, $old_instance) {
        return $new_instance;
    }

    // If widget content needs a form
    function form($instance) {
        //widgetform in backend
        $simple_image_url = strip_tags($instance[\'simple_image_url\']);
        $simple_image_link = strip_tags($instance[\'simple_image_link\']);
        $simple_title = strip_tags($instance[\'simple_title\']);
        $simple_title_link = strip_tags($instance[\'simple_title_link\']);
        $simple_text = strip_tags($instance[\'simple_text\']);
        ?>
            <p>
                <label for="<?php echo $this->get_field_id(\'simple_image_url\'); ?>">Image URL: </label>
                <input class="widefat" id="<?php echo $this->get_field_id(\'simple_image_url\'); ?>" name="<?php echo $this->get_field_name(\'simple_image_url\'); ?>" type="text" value="<?php echo attribute_escape($simple_image_url); ?>" />
            </p>
            <p>
                <label for="<?php echo $this->get_field_id(\'simple_image_link\'); ?>">Image Link: </label>
                <input class="widefat" id="<?php echo $this->get_field_id(\'simple_image_link\'); ?>" name="<?php echo $this->get_field_name(\'simple_image_link\'); ?>" type="text" value="<?php echo attribute_escape($simple_image_link); ?>" />
            </p>
            <p>
                <label for="<?php echo $this->get_field_id(\'simple_title\'); ?>">Title: </label>
                <input class="widefat" id="<?php echo $this->get_field_id(\'simple_title\'); ?>" name="<?php echo $this->get_field_name(\'simple_title\'); ?>" type="text" value="<?php echo attribute_escape($simple_title); ?>" />
            </p>
            <p>
                <label for="<?php echo $this->get_field_id(\'simple_title_link\'); ?>">Title Link: </label>
                <input class="widefat" id="<?php echo $this->get_field_id(\'simple_title_link\'); ?>" name="<?php echo $this->get_field_name(\'simple_title_link\'); ?>" type="text" value="<?php echo attribute_escape($simple_title_link); ?>" />
            </p>
            <p>
                <label for="<?php echo $this->get_field_id(\'simple_text\'); ?>">Text: </label>
                <textarea class="widefat" id="<?php echo $this->get_field_id(\'simple_text\'); ?>" name="<?php echo $this->get_field_name(\'simple_text\'); ?>"><?php echo attribute_escape($simple_text); ?></textarea>
            </p>

        <?php       
    }

}

register_widget(\'widget_simple\');

结束