Build Custom Widgets For WordPress

 Technology plays a major role in enhancing communication both in business and individual social life. With these rapid changes entrepreneurs need to jibe their practices with the unrelenting changes. However, catching up with technology is no walk in the park; it takes hard work, unyielding passion and willingness to learn. It therefore resonates for online business people to adapt shrewd internet marketing tools to attract more people to their businesses. Whilst there is a swarm of options internet newbie’s can juggle with, very few of those options compare to the simplicity wordpress places at their disposal.

It goes without saying that the benefits that accrue when people and businesses set up an online presence are beyond measure. Not only does it offer you a platform to network and meet new people, but also ensures you increase sales while creating a household brand. Internet marketing, especially for start-ups, is a cheap yet effective way of marketing your personality or products to a wider market, without having to spend too much money.

Speaking of money, no one wants to spend money on items they are not certain will give sufficient service; and with this comes the charm of wordpress. Here are several tips and nuggets that will help kick-start your online selling campaign.

About WordPress Widgets

WordPress widgets allow user to simply drag and insert elements into their site. Several themes and word press plug- ins use widgets to enable users to create their own unique layouts. Some plug- ins may even help you improve widget management. However for purposes of this article we will only show you how to build custom widgets for your word press site. Caution to you if you are green on programming, this content may be a little complicated to grasp.

What is a widget?

Originally, wordpress widgets were created to give users a simple and hands- on way of giving design and controlling structure of their themes. The advantage of custom widgets is that you will easily drag them and drop them in any widget area of your wordpress site. for developers this is a very flexible utility. You can also easily add functions to your web and allow users to use the functions without messing with the initial code. WordPress aloes allows users to create their own widgets in a site specified plugin, drag and drop in on any theme you are using.

Before starting you may need to build a site-specific plug-in where you will paste the widget code after preparing. You may choose to paste the code in the theme’s function.php file; but we highly recommend a site-specific plug-in, especially for beginners. WordPress recommends extending the Wp_widget and several of its functions. This base class contains important information that should be extended to get a working widget.

The XX_widget class is found in wp-icludes/widgets.php

01 class My_Widget extends WP_Widget {

02 /**

03 * Sets up the widgets name etc

04 */

05 public functions __construct() {

06 // widget actual processes

07 }

08 /**

09 * Outputs new content widget

10 *

11 * @param array $args

12 * @param array $instance

13 */

14 public function widget( $args, $instance ) {

15 // outputs the setuo of the widget

16 }

17 /**

18 * Outputs the options form on admin

19 *

20 * @param array $instance The widget options

21 */

22 public function form( $instance ) {

23 // outputs the options form on admin

24 }

25 /**

36 * Processing widget options on save

31 *

32 * @param array $new_instance The new options

33 * @param array $old_instance The previous options

34 */

35 public function update( $new_instance, $old_instance ) {

36 // processes widget options to save>

37 }

38 }

This widget may be registered using the widget_init hook:

If using php 5.3 + only

01 add_action( ‘widgets_init’, function(){

02 register_widget( ‘My_Widget’ );

03 });

If using PHP 5.2+:

01 add_action(‘widgets_init’,

02 create_function(”, ‘return register_widget(“My_Widget”);’)

03 );

Here is a real Example . The sample codes used create a code named weebo_ widget that greets visitors

01 /**

02 * Adds weebo_Widget widget.

03 */

04 class weebo_Widget extends WP_Widget {

05 /**

06 * Register new widget with XX.

07 */

08 function __construct() {

09 parent::__construct(

10 ‘weebo_widget’, // Base ID

11 __(‘Widget Title’, ‘text_domain’), // Name

12 array( ‘description’ => __( ‘A weebo Widget’, ‘text_domain’ ), ) // Args

13 );

14 }

15 /**

16 * up-end display of widget.

17 *

18 * @see XX_Widget::widget()>

19 *

20 * @param array $args Widget arguments.

21 * @param array $instance Saved previous values from database.

22 */

23 public function widget( $args, $instance ) {

24 $title = apply_filters( ‘widget_title’, $instance[‘title’] );


26 echo $args[‘before_widget’];

27 if ( ! empty( $title ) )

28 echo $args[‘before_title’] . $title . $args[‘after_title’];

29 echo __( ‘Hello, World!’, ‘text_domain’ );

30 echo $args[‘after_widget’];

31 }

32 /**

33 * Back-end widget form.

34 *

35 * @se WP_Widgt::form()>

36 *

37 * @param array $instance Previously savd values from databse.

38 */

39 public function form( $instance ) {

40 if ( isset( $instance[ ‘title’ ] ) ) {

41 $title = $instance[ ‘title’ ];

42 }

43 else {

44 $title = __( ‘New heading’, ‘text_domain’ );

45 }

46 ?>

47 <p>

48 <label for=”<?php echo $this->get_field_id( ‘title’ ); ?>”><?php _e( ‘head:’ ); ?></label>

49 <input clas=”widefut” id=”<?php echo $this->get_field_id( ‘title’ ); ?>” name=”<?php echo $this->get_field_name( ‘title’ ); ?>” type=”text” value=”<?php echo esc_attr( $title ); ?>”>

50 </p>

51 <?php

52 }

53 /**

54 *

55 *

56 * @see WP_Widgt::update()>

57 *

58 * @param array $new_instance Valus just snt to be saved.>

59 * @param array $old_instance Previously saved values frm databas.

60 *

61 * @return array Update safe value to be saved.>

62 */

63 public function update( $new_instance, $old_instance ) {

64 $instance = array();

65 $instance[‘title’] = ( ! empty( $new_instance[‘title’] ) ) ? strip_tags( $new_instance[‘title’] 68 ) : ”;

66 return $instance;

67 }

68 } // class weebo_Widget

Save the sample widget to roll it into action

01 // register weebo_Widget widget

02 function register_weebo_widget() {

03 register_widget( ‘weebo_Widget’ );

04 }

05 add_action( ‘widgets_init’, ‘register_weebo_widget’ );

Ps. You must generate get_field_name and get_field_id functions to get name and id.

If the title has name spaces, here is how to create the widget

For PHP 5.3 users, call the director directly as shown below.

01 namespace a\b\c;

02 class My_Widget_Class extends \WP_Widget {

03 function __construct() {

04 parent::__construct( ‘baseID’, ‘name’ );

05 }

… // … rest of functions

Then Register the Widget at

01 add_action( ‘widgets_init’, function(){

02 register_widget( ‘a\b\c\My_Widget_Class’ );

03 });

Go to Appearance >> Widgets, then drag and drop weebo widget in your sidebar to view you newly created widget in action.

It is quite simple, if you understand the steps. First you create a custom widget. Then define the widget and its function and how the widget will display. Similarly, we also defined how the widget will handle changes. Finally we registered the widget and loaded it to sidebar.

How Widgets are Displayed and Widget Areas

WordPress allows widgets to be displayed in two forms. First in the widget areas and secondly as independent widgets. The concept of independent widgets is complicated and only used by few individuals who might be experts.

The second way is to display this Widget on a Widget Area via the Appearance -> Widgets menu

When ready you can display the custom widget in any chosen file theme as follows


<?php if ( dynamic_sidebar(‘example_widget_area_name’) ) : else : endif; ?>.


Bottom Line; Salient Advice

Since creating a working online presence can be an uphill task, especially for novices, it is essential to learn from experts how to best create and manage a site. Experts have experience, through time, on tips that actually work to your advantage when starting online.

Without proper knowledge, through training, your wordpress blog could turn out to be just any other blog that gets little or no attention at all. This necessitates the need to learn important tricks that will sell you better.

In conclusion, it is important to note that; wordpress is a perfect place to start your online campaign. For example, they have an option that enables you to change your to just .com when you pay a little fee.

Post A Reply

CommentLuv badge