{"id":3738,"date":"2011-02-04T20:21:34","date_gmt":"2011-02-04T18:21:34","guid":{"rendered":"https:\/\/crazyleafdesign.com\/blog\/?p=3738"},"modified":"2013-02-20T00:23:54","modified_gmt":"2013-02-19T22:23:54","slug":"creating-a-widget-in-wordpress-the-basic-stuff-with-an-example","status":"publish","type":"post","link":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/","title":{"rendered":"Creating a Widget in WordPress – The Basic Stuff with an Example"},"content":{"rendered":"

Widgets in WordPress <\/strong>are small components that one can write which from the admin area of wordpress lets the admin to drag and drop a widget on any of the registered widgetize area of the theme. Then the widget will perform its function echo its output on the area where it is dragged and dropped.<\/p>\n

All the registered widgets are seen in the widgets menu in the admin section as shown below.<\/p>\n

\"\"<\/p>\n

Creating widgets in wordpress<\/h2>\n

Creating widgets in WordPress <\/strong>is very simple. We are now going to create a widget in WordPress <\/strong>which will display a few newest posts posted in WordPress<\/strong>.<\/p>\n

Here is the code of the widget which you can put in the functions.php<\/strong> file of your theme :<\/p>\n

\r\nclass trywidget extends WP_Widget {\r\nfunction trywidget() {\r\n\/\/ widget actual processes\r\n$widget_ops = array('classname' => 'trywidget', 'description' => 'description for trywidget' );\r\n$this->WP_Widget('trywidget', 'trywidget', $widget_ops);\r\n}\r\n\r\nfunction form($instance) {\r\n\/\/ outputs the options form on admin\r\n$defaults = array( 'title' => __('Latest posts'), 'count' => 0 );\r\n$instance = wp_parse_args( (array) $instance, $defaults );\r\n$count = isset($instance['count']) ?  $instance['count'] :0;\r\n?>\r\n\r\n<label for="<?php echo $this->get_field_id( 'title' ); ?>"><\/label>\r\n<input id="<?php echo $this->get_field_id( 'title' ); ?>" class="widefat" name="<?php echo $this->get_field_name( 'title' ); ?>" value="<?php echo $instance['title']; ?>" \/>\r\n\r\n<label for="<?php echo $this->get_field_id( 'count' ); ?>"><\/label>\r\n<input id="<?php echo $this->get_field_id( 'count' ); ?>" class="widefat" name="<?php echo $this->get_field_name( 'count' ); ?>" value="<?php echo $instance['count']; ?>" \/>\r\n\r\n}\r\n\r\nfunction update($new_instance, $old_instance) {\r\n\/\/ processes widget options to be saved\r\n\r\n$instance = $old_instance;\r\n$instance['title'] = strip_tags( $new_instance['title'] );\r\n$instance['count'] = !empty($new_instance['count']) ? $new_instance['count'] : 0;\r\nreturn $instance;\r\n}\r\n\r\nfunction widget($args, $instance) {\r\n\/\/ outputs the content of the widget\r\nextract( $args );\r\n$title = apply_filters('widget_title', $instance['title'] );\r\n$count = $instance['count'] ? $instance['count'] : '0';\r\necho $before_widget;\r\nif ( $title )\r\necho $before_title . $title . $after_title;\r\necho '\r\n<ul>';\r\n\r\nquery_posts('showposts='.$count);\r\nwhile ( have_posts() ) : the_post(); ?>\r\n<li><a title="Permanent Link to <?php the_title_attribute(); ?>" rel="bookmark" href="<?php the_permalink() ?>"><\/a><\/li>\r\necho '<\/ul>\r\n';\r\necho $after_widget;\r\n}\r\n\r\n}\r\nregister_widget('trywidget');\r\n<\/pre>\n
To create a widget you have to create a class which extends the base class WP_Widget.<\/p>\n
<\/p>\n
Constructor<\/h2>\n
\r\nfunction trywidget() {\r\n\/\/ widget actual processes\r\n$widget_ops = array('classname' => 'trywidget', 'description' => 'description for trywidget' );\r\n$this->WP_Widget('trywidget', 'trywidget', $widget_ops);\r\n}\r\n\r\n<\/pre>\n
In the constructor we give id and the name which are unique to this widget . With these values we can also pass some other option for our widget like in our example we are passing the description of the widget which will be displayed.<\/p>\n
Getting the widget options displayed in the admin section<\/h2>\n
\r\nfunction form($instance) {\r\n\/\/ outputs the options form on admin\r\n$defaults = array( 'title' => __('Latest posts'), 'count' => 0 );\r\n$instance = wp_parse_args( (array) $instance, $defaults );\r\n$count = isset($instance['count']) ?  $instance['count'] :0;\r\n?>\r\n<p>\r\n<label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:' ); ?><\/label>\r\n<input id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" value="<?php echo $instance['title']; ?>" class="widefat" \/>\r\n<\/p>\r\n<p>\r\n<label for="<?php echo $this->get_field_id( 'count' ); ?>"><?php _e( 'Number of post:' ); ?><\/label>\r\n<input id="<?php echo $this->get_field_id( 'count' ); ?>" name="<?php echo $this->get_field_name( 'count' ); ?>" value="<?php echo $instance['count']; ?>" class="widefat" \/>\r\n<\/p>\r\n\r\n<?php\r\n}\r\n\r\n<\/pre>\n
To display the options in the admin you have to override the function function form($instance) in you widget class . In this function we have created two fields as options to the widget. One is the title and second is how many newest posts should be displayed by your widget. Once you have written this function and drag and drop your widget on one of the widgetize area you should be able to see your form as shown below.<\/p>\n
\"\"<\/p>\n
Updating the options of your widget<\/h2>\n
\r\nfunction update($new_instance, $old_instance) {\r\n\/\/ processes widget options to be saved\r\n\r\n$instance = $old_instance;\r\n$instance['title'] = strip_tags( $new_instance['title'] );\r\n$instance['count'] = !empty($new_instance['count']) ? $new_instance['count'] : 0;\r\nreturn $instance;\r\n}\r\n<\/pre>\n
To update the options of your widget once save is clicked on the widget shown above we have to override the function function update($new_instance, $old_instance)<\/strong>.<\/p>\n
In this we have to add the values $intance variable and the options will be saved automatically.<\/p>\n
Actual functionality of the widget<\/h2>\n
\r\nfunction widget($args, $instance) {\r\n\/\/ outputs the content of the widget\r\nextract( $args );\r\n$title = apply_filters('widget_title', $instance['title'] );\r\n$count = $instance['count'] ? $instance['count'] : '0';\r\necho $before_widget;\r\nif ( $title )\r\necho $before_title . $title . $after_title;\r\necho '\r\n<ul>';\r\n\r\nquery_posts('showposts='.$count);\r\nwhile ( have_posts() ) : the_post(); ?>\r\n<li><a title="Permanent Link to <?php the_title_attribute(); ?>" rel="bookmark" href="<?php the_permalink() ?>"><\/a><\/li>\r\necho '<\/ul>\r\n';\r\necho $after_widget;\r\n}\r\n\r\n<\/pre>\n
We have to add the actual functionality of the widget in the function function widget($args, $instance)<\/strong> . Here we are first removing the options for the widget which were saved. We remove the title option and display it . Then we get the count and then using the WordPress <\/strong>api query_posts we get the newest posts and then echo them.<\/p>\n
Once this is done the widget is ready. Then we have to register the widget with the WordPress <\/strong>system using the api register_widget(‘trywidget’)<\/strong>; .<\/p>\n
Now the widget is ready and after it is dragged and dropped on a widgetize area in the admin the output of the widget can be seen in the front end.<\/p>\n
\"\"<\/p>\n
Conclusion<\/h2>\n
Widgets are very powerful components of the wordpress systems. Now creating widgets with the wordpress api has become very simple. This has made developing widgets for wordpress fast and very easy.<\/p>\n","protected":false},"excerpt":{"rendered":"
Widgets in WordPress are small components that one can write which from the admin area of wordpress lets the admin to drag and drop a widget on any of the registered widgetize area of the theme. Then the widget will perform its function echo its output on the area where it is dragged and dropped. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[40],"tags":[],"adace-sponsor":[],"class_list":["post-3738","post","type-post","status-publish","format-standard","hentry","category-programming"],"acf":[],"yoast_head":"\nCreating a Widget in Wordpress - The Basic Stuff with an Example<\/title>\n<meta name=\"description\" content=\"Widgets in Wordpress are small components that one can write which from the admin area of wordpress lets the admin to drag and drop a widget on any of the\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Creating a Widget in Wordpress - The Basic Stuff with an Example\" \/>\n<meta property=\"og:description\" content=\"Widgets in Wordpress are small components that one can write which from the admin area of wordpress lets the admin to drag and drop a widget on any of the\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/\" \/>\n<meta property=\"og:site_name\" content=\"CrazyLeaf Design Blog\" \/>\n<meta property=\"article:publisher\" content=\"http:\/\/www.facebook.com\/crazyleafdesign\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/crazyleafdesign\" \/>\n<meta property=\"article:published_time\" content=\"2011-02-04T18:21:34+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2013-02-19T22:23:54+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/media.crazyleafdesign.com\/2011\/02\/011.jpg\" \/>\n<meta name=\"author\" content=\"CrazyLeaf Editorial\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@crazyleaf\" \/>\n<meta name=\"twitter:site\" content=\"@crazyleaf\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"CrazyLeaf Editorial\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/\"},\"author\":{\"name\":\"CrazyLeaf Editorial\",\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/#\\\/schema\\\/person\\\/b6a5ee60ad8ef2b81b481fc4deb4b9d0\"},\"headline\":\"Creating a Widget in WordPress – The Basic Stuff with an Example\",\"datePublished\":\"2011-02-04T18:21:34+00:00\",\"dateModified\":\"2013-02-19T22:23:54+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/\"},\"wordCount\":488,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/#primaryimage\"},\"thumbnailUrl\":\"http:\\\/\\\/media.crazyleafdesign.com\\\/2011\\\/02\\\/011.jpg\",\"articleSection\":[\"Programming\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/\",\"url\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/\",\"name\":\"Creating a Widget in Wordpress - The Basic Stuff with an Example\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/#primaryimage\"},\"thumbnailUrl\":\"http:\\\/\\\/media.crazyleafdesign.com\\\/2011\\\/02\\\/011.jpg\",\"datePublished\":\"2011-02-04T18:21:34+00:00\",\"dateModified\":\"2013-02-19T22:23:54+00:00\",\"description\":\"Widgets in Wordpress are small components that one can write which from the admin area of wordpress lets the admin to drag and drop a widget on any of the\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/#primaryimage\",\"url\":\"http:\\\/\\\/media.crazyleafdesign.com\\\/2011\\\/02\\\/011.jpg\",\"contentUrl\":\"http:\\\/\\\/media.crazyleafdesign.com\\\/2011\\\/02\\\/011.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Web Design\",\"item\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/category\\\/web-design\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Programming\",\"item\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/category\\\/web-design\\\/programming\\\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"Creating a Widget in WordPress – The Basic Stuff with an Example\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/\",\"name\":\"CrazyLeaf Design Blog\",\"description\":\"LETS INSPIRE IN WEB AND GRAPHIC DESIGN!\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/#organization\",\"name\":\"CrazyLeaf Design Blog\",\"url\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/cropped-cld-logo-dark.png\",\"contentUrl\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/cropped-cld-logo-dark.png\",\"width\":690,\"height\":132,\"caption\":\"CrazyLeaf Design Blog\"},\"image\":{\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"http:\\\/\\\/www.facebook.com\\\/crazyleafdesign\",\"https:\\\/\\\/x.com\\\/crazyleaf\",\"https:\\\/\\\/www.pinterest.com\\\/crazyleaf\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/#\\\/schema\\\/person\\\/b6a5ee60ad8ef2b81b481fc4deb4b9d0\",\"name\":\"CrazyLeaf Editorial\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/60e71ee9d3c9922c5c831dc4fd053dca7f3c57ed09f3e7aa0fefbb4433eae4d5?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/60e71ee9d3c9922c5c831dc4fd053dca7f3c57ed09f3e7aa0fefbb4433eae4d5?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/60e71ee9d3c9922c5c831dc4fd053dca7f3c57ed09f3e7aa0fefbb4433eae4d5?s=96&d=mm&r=g\",\"caption\":\"CrazyLeaf Editorial\"},\"description\":\"Follow us on Twitter @crazyleaf , Facebook , Pinterest\",\"sameAs\":[\"https:\\\/\\\/crazyleafdesign.com\\\/blog\",\"https:\\\/\\\/www.facebook.com\\\/crazyleafdesign\",\"https:\\\/\\\/x.com\\\/crazyleaf\"],\"url\":\"https:\\\/\\\/www.crazyleafdesign.com\\\/blog\\\/author\\\/administrator\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Creating a Widget in Wordpress - The Basic Stuff with an Example","description":"Widgets in Wordpress are small components that one can write which from the admin area of wordpress lets the admin to drag and drop a widget on any of the","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/","og_locale":"en_US","og_type":"article","og_title":"Creating a Widget in Wordpress - The Basic Stuff with an Example","og_description":"Widgets in Wordpress are small components that one can write which from the admin area of wordpress lets the admin to drag and drop a widget on any of the","og_url":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/","og_site_name":"CrazyLeaf Design Blog","article_publisher":"http:\/\/www.facebook.com\/crazyleafdesign","article_author":"https:\/\/www.facebook.com\/crazyleafdesign","article_published_time":"2011-02-04T18:21:34+00:00","article_modified_time":"2013-02-19T22:23:54+00:00","og_image":[{"url":"http:\/\/media.crazyleafdesign.com\/2011\/02\/011.jpg","type":"","width":"","height":""}],"author":"CrazyLeaf Editorial","twitter_card":"summary_large_image","twitter_creator":"@crazyleaf","twitter_site":"@crazyleaf","twitter_misc":{"Written by":"CrazyLeaf Editorial","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/#article","isPartOf":{"@id":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/"},"author":{"name":"CrazyLeaf Editorial","@id":"https:\/\/www.crazyleafdesign.com\/blog\/#\/schema\/person\/b6a5ee60ad8ef2b81b481fc4deb4b9d0"},"headline":"Creating a Widget in WordPress – The Basic Stuff with an Example","datePublished":"2011-02-04T18:21:34+00:00","dateModified":"2013-02-19T22:23:54+00:00","mainEntityOfPage":{"@id":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/"},"wordCount":488,"commentCount":0,"publisher":{"@id":"https:\/\/www.crazyleafdesign.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/#primaryimage"},"thumbnailUrl":"http:\/\/media.crazyleafdesign.com\/2011\/02\/011.jpg","articleSection":["Programming"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/","url":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/","name":"Creating a Widget in Wordpress - The Basic Stuff with an Example","isPartOf":{"@id":"https:\/\/www.crazyleafdesign.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/#primaryimage"},"image":{"@id":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/#primaryimage"},"thumbnailUrl":"http:\/\/media.crazyleafdesign.com\/2011\/02\/011.jpg","datePublished":"2011-02-04T18:21:34+00:00","dateModified":"2013-02-19T22:23:54+00:00","description":"Widgets in Wordpress are small components that one can write which from the admin area of wordpress lets the admin to drag and drop a widget on any of the","breadcrumb":{"@id":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/#primaryimage","url":"http:\/\/media.crazyleafdesign.com\/2011\/02\/011.jpg","contentUrl":"http:\/\/media.crazyleafdesign.com\/2011\/02\/011.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.crazyleafdesign.com\/blog\/creating-a-widget-in-wordpress-the-basic-stuff-with-an-example\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.crazyleafdesign.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Web Design","item":"https:\/\/www.crazyleafdesign.com\/blog\/category\/web-design\/"},{"@type":"ListItem","position":3,"name":"Programming","item":"https:\/\/www.crazyleafdesign.com\/blog\/category\/web-design\/programming\/"},{"@type":"ListItem","position":4,"name":"Creating a Widget in WordPress – The Basic Stuff with an Example"}]},{"@type":"WebSite","@id":"https:\/\/www.crazyleafdesign.com\/blog\/#website","url":"https:\/\/www.crazyleafdesign.com\/blog\/","name":"CrazyLeaf Design Blog","description":"LETS INSPIRE IN WEB AND GRAPHIC DESIGN!","publisher":{"@id":"https:\/\/www.crazyleafdesign.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.crazyleafdesign.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.crazyleafdesign.com\/blog\/#organization","name":"CrazyLeaf Design Blog","url":"https:\/\/www.crazyleafdesign.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.crazyleafdesign.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.crazyleafdesign.com\/blog\/wp-content\/uploads\/2026\/10\/cropped-cld-logo-dark.png","contentUrl":"https:\/\/www.crazyleafdesign.com\/blog\/wp-content\/uploads\/2026\/10\/cropped-cld-logo-dark.png","width":690,"height":132,"caption":"CrazyLeaf Design Blog"},"image":{"@id":"https:\/\/www.crazyleafdesign.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["http:\/\/www.facebook.com\/crazyleafdesign","https:\/\/x.com\/crazyleaf","https:\/\/www.pinterest.com\/crazyleaf\/"]},{"@type":"Person","@id":"https:\/\/www.crazyleafdesign.com\/blog\/#\/schema\/person\/b6a5ee60ad8ef2b81b481fc4deb4b9d0","name":"CrazyLeaf Editorial","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/60e71ee9d3c9922c5c831dc4fd053dca7f3c57ed09f3e7aa0fefbb4433eae4d5?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/60e71ee9d3c9922c5c831dc4fd053dca7f3c57ed09f3e7aa0fefbb4433eae4d5?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/60e71ee9d3c9922c5c831dc4fd053dca7f3c57ed09f3e7aa0fefbb4433eae4d5?s=96&d=mm&r=g","caption":"CrazyLeaf Editorial"},"description":"Follow us on Twitter @crazyleaf , Facebook , Pinterest","sameAs":["https:\/\/crazyleafdesign.com\/blog","https:\/\/www.facebook.com\/crazyleafdesign","https:\/\/x.com\/crazyleaf"],"url":"https:\/\/www.crazyleafdesign.com\/blog\/author\/administrator\/"}]}},"wps_subtitle":"","_links":{"self":[{"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/posts\/3738","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/comments?post=3738"}],"version-history":[{"count":8,"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/posts\/3738\/revisions"}],"predecessor-version":[{"id":3743,"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/posts\/3738\/revisions\/3743"}],"wp:attachment":[{"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/media?parent=3738"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/categories?post=3738"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/tags?post=3738"},{"taxonomy":"adace-sponsor","embeddable":true,"href":"https:\/\/www.crazyleafdesign.com\/blog\/wp-json\/wp\/v2\/adace-sponsor?post=3738"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}