How to create WordPress widgets with demo

Hi friends, In this post I am going to explain about wordpress custom widget and how to create WordPress widgets using with demo. For widget development we have follow the functions as mentioned in below.

1. Widget Class name should be ended with ‘_Widget’ only.

2. Class should extends ‘WP_Widget’

3. Have four functions

a) __construct()
b) widget($args,$instance)
c) form($instance)
d) update($new_instance,$old_instance)
How to create WordPress widgets with demo by Anil Kumar Panigrahi

How to create WordPress widgets with demo by Anil Kumar Panigrahi

demo link for How to create WordPress widgets with demo download link for How to create WordPress widgets with demo

Class

class contains the name with ‘__Widget’ and extends the ‘WP_Widget’

Class FL_Widget extends WP_Widget{
}

__construct()

__construct() is constructor for this class widget. This code will be run every time widget is loaded, when activated and updated.

public function __construct(){
        parent::__construct(
            'fl_widget', // Base ID
            'Favorite Link Widget', // Name
            array( 'description' => __( 'A Favorite Link Widget is developed by Anil Kumar Panigrahi', 'text_domain' ), ) // Args
        );
       
    }

widget($args,$instance)

widget($args,$instance) function contains the code that will be rendered to the sidebar when widget is added and that will be visible to wbsite visitors.

public function widget($args,$instance){
        $title = apply_filters( 'widget_title', $instance['title'] );
        echo $args['before_widget'];
        echo __( 'Hello, World!', 'text_domain' );
        echo $args['after_widget'];
    }

form($instance)

form($instance) function contains the setting page on WordPress widget admin screen. That will be visible in the Appearance -> Widgets. This method called the
form and all controlls will appear when widget options are expanded

public function form($instance){
        if(isset($instance['title'])){
            $title = $instance['title'];
        }else{
            $title = __('New Widget Title','text_domain');
        }
                ?>
        <p>
        <label for="<?php echo $this->get_field_name( 'title' ); ?>"><?php _e( 'Widget 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

    }

update($new_instance,$old_instance)

update($new_instance,$old_instance) function called when click on “Save” option in the settings page in the admin secion/screen. And those details will save
into database by options.

public function update($new_instance,$old_instance){
        $instance = array();
        $instance['title'] = ( ! empty( $new_instance['title'] ) ) ? strip_tags( $new_instance['title'] ) : '';
        return $instance;
    }

Anil Kumar Panigrahi

With more than 10 years experience in PHP and Founder of Anil Labs, a blog for PHP and related posts. contributed posts regarding CodeIgniter, CakePHP and Learn PHP online

Contact : [email protected]

You may also like...

3 Responses

  1. September 16, 2013

    […] friends, In the earlier post learned how to create wordpress widgets and in this post I will explain how to execute PHP code in your widgets in WordPress. Recently I […]

  2. October 9, 2013

    […] like explain how to write php code in author widget in wordpress blog. In earlier we learned about how to create WordPress widgets and execute PHP Code in WordPress Widget, this post is extended to earlier posts. PHP code for […]

  3. November 22, 2017

    […] the earlier post, we learned about how to create WordPress widget. This post explains extension for the previous post. In this widget, we can add multiple links as […]

Leave a Reply

Your email address will not be published. Required fields are marked *