faressoft
faressoft

Reputation: 19651

How to create new wordpress widgets for my themes

How to create new wordpress widgets for my themes ?

alt text

Upvotes: 0

Views: 251

Answers (3)

Mustaasam Saleem
Mustaasam Saleem

Reputation: 166

If you want to create a widget. Navigate to your plugins folder and create a blank file named as “sample.php” in “Sample” folder..

Copy below code and paste in sample.php file.

<?php
/*
Plugin Name: Widget
Description: Widget Description
*/

// Creating the widget
// Create a class named as "sample_widget" that is a child class of "WP_Widget".
class sample_widget extends WP_Widget
{
    //Constructor of class
    public function __construct()
    {
        parent::__construct(
        // Id of our widget.
            'sample_widget', 
        // This is the widget name that will be visible to user
            __('Sample Widget'), 
        // Description of our widget
            array(
            'description' => __('Description of our widget.')
        ));
    }

    // Creating widget front-end
    // This is where the action happens
    // Creating function named as "widget", receiving two parameters.
    public function widget($args, $instance)
    {
        /*Getting and assigning our widget title to wordpress hook "widget_title"
        and passing its value to "$title" */
        $title = apply_filters('widget_title', $instance['title']);
        // Area, that is before the widget is diplayed
        echo $args['before_widget'];
        // Checking "$title" is empty or not
        if (!empty($title)) /* If "$title" is not empty, below code will execute.
        $args['before_title'] -> Displaying content before our widget title
        $title -> Display our widget title
        $args['after_title'] -> Displaying content after our widget title */ {
            echo $args['before_title'] . $title . $args['after_title'];
        }

        // Displaying text of our widget
        echo __('Hello, this is our widget text!');
        // Displaying content after our widget
        echo $args['after_widget'];
    }

    // This function naming our widget title
    public function form($instance)
    {
        // If title is already set.
        if (isset($instance['title'])) {
            // $title is getting already assigned title
            $title = $instance['title'];
        }
        // Otherwise our default title will be "Widget title"
        else {
            $title = __('Widget title');
        }

?>
<!-- These are the settings and user interface that an admin will see -->
<p>
<!-- Already set title will be displayed at the top of our widget in admin panel -->
<label for="<?php
        echo $this->get_field_id('title');
?>"><?php
        _e('Title:');
?></label>
<input class="widefat" id="<?php
        echo $this->get_field_id('title');
?>" name="<?php
        echo $this->get_field_name('title');
?>" type="text" value="<?php
        echo esc_attr($title);
?>" />
</p>
<?php
    }

    // This function will replace old title with new title of our widget
    public function update($new_instance, $old_instance)
    {
        $instance          = array();
        $instance['title'] = (!empty($new_instance['title'])) ? strip_tags($new_instance['title']) : '';
        return $instance;
    }
}

// Function to register and load our newly widget
function sample_widget_load()
{
    // Registering our widget named as "sample_widget"
    register_widget('sample_widget');
}
// Calling our newly created function named as "sample_widget_load" to register our widget
add_action('widgets_init', 'sample_widget_load');

?>

Upvotes: 1

Damien
Damien

Reputation: 2254

This is more a question for google than stackoverflow. You'll find tons of tutorials and examples on the web.

Upvotes: 0

Greyes
Greyes

Reputation: 113

This is my favourite tutorial about that:

http://justintadlock.com/archives/2009/05/26/the-complete-guide-to-creating-widgets-in-wordpress-28

I'm using it as a base to all my widgets.

Basically, the widget is a plugin, but you extend the class WP_Widget. It's quite easy, just follow that tutorial.

Also this is helpful http://codex.wordpress.org/Widgets_API

Good luck!

Upvotes: 0

Related Questions