Custom Widget

Widgets are an important part of WordPress and this tool can be used in an easy way. The widgets are generally used to add specific features and the desired content to the websites. The user can specify a proper area which is settled for the widgets and it can be footer, sidebar or a header. One can use its functions by dragging and dropping it to that particular place.

Generally plugins are used in order to create a custom widget in WordPress and it can be used and viewed after its activation on the website. The one, who wants to create custom widgets in WordPress, will have to follow these steps:
Enter Plugin Details
The plugin details should be there with the user and he should enter the respective details e.g. short description of the plugin, author’s name of the plugin, URL of the plugin and Plugin name etc like as below:

/*
Plugin Name: Custom Widget
Plugin URI: https://www.powerfaq.com/business-hours/
Description: Developing a custom wordpress widget.
Author: Mac
Author URI: https://www.powerfaq.com
Version: 1.4
*/

Widget Name
The widget, which is to be created, should be defined with a proper name. A class enclosing the widget should be created with a valid constructor. The constructor should be named as per the name of the widget.

 class My_Widget extends WP_Widget {

/* constructor */
function My_Widget() {
parent::WP_Widget(false, $name = __('My Widget', 'wp_widget_plugin') );
}

Add Functionality to Widget
After that, there a specific function should be defined for the widget. This can be done by filling the related data in the form which was created when the widget was being added to the sidebar. The CSS code should also be defined for the widget.

The widget data should be updated on the backend and after that, it should be specified to display the related widget on the frontend.

/* widget form creation */

function form( $instance ) {

	$defaults = array( 'title' => __('', 'timing'), 'show_info' => true );
	$instance = wp_parse_args( (array) $instance, $defaults );
	echo '<label for="'.$this->get_field_id('title').'">'. _e('Title:', 'timing').'</label>';
	echo '<input id="'.$this->get_field_id('title').'" name="'.$this->get_field_name( 'title' ).'" value="'.$instance['title'].'"  />';

 }

After that, the user should register the widget under WordPress. With the registration, the widget can be seen under the WordPress dashboard.
To show the widget at front end we need to add the function named widget() inside the class. This function having two parameters $args and $instance.

 /* Display widget at front end.*/
function widget( $args, $instance ) {
	extract( $args );

	$title = apply_filters('widget_title', $instance['title'] );

	$show_info = isset($instance['show_info']) ? $instance['show_info'] :false;

	echo $before_widget;

	echo $before_title . $title . $after_title;

	echo '<div class="my_widget widget_plugin_box">';

	show_calculation();

	echo "</div>";

	echo $after_widget;
}

Register widget
Finally need to register the widget in WordPress so that it will be show in widget section. Need to add the code below:

/* Register custom widget */
add_action( 'widgets_init', 'register_my_widget' );
function register_my_widget() {
	register_widget( 'My_Widget' );
}