In: How to's
29 Dec 2008Until now, whenever I needed to have something displayed on the sidebar of my WordPress blog, I simply input my HTML code into a Text Widget and added it to the sidebar. This worked fine until I needed something with a bit of intelligence to it.
I labored for a couple of days about this and eventually solved my problem, even with my limited PHP skills.
But what I discovered was that there did not seem to be a ready made, easy to use template for creating a Sidebar Widget or a WordPress plug-in. So I have created this easy to use template for everyone to copy and use as they see fit:
function displayWidgetContent() {?>
<p>
Your HTML or PHP code goes here.
</p>
<?php }
function widget_myWidget($args) {
extract($args);
echo $before_widget;
echo $before_title;?>Plug-in/Widget Title goes here<?php echo $after_title;
displayWidgetContent();
echo $after_widget;
}
function myWidget_init()
{
register_sidebar_widget(__(‘My Widget’), ‘widget_myWidget’);
}
add_action("plugins_loaded", "myWidget_init");
?>
Now for some description about how to customize this for your needs.
First, note that PHP code is wrapped in tags like this <?php ?>. This plug-in is written in PHP and HTML so we open and close these tags frequently.
At the top, there is a section that starts with a ‘/*’ and ends with a ‘*/’. Between these two lines is some critical information about your plug-in. The labels for each should not be changed as WordPress uses these for displaying information about your plug-in on the Plug-ins page of your WordPress admin panel. But the information next to each label should be updated to reflect the proper information for your plug-in.
If your a beginner, you should also understand that PHP uses ‘functions’ to group program instructions together. I have separated out a function that should be used for your custom code ‘displayWidgetContent’. You can simply put HTML code here starting with the opening <p> tag up to and including the closing </p> tag. For the more adventurous, try your hand at putting some PHP code in here. Just remember to wrap it in the PHP tags.
To customize the heading of your plug-in as it would appear in the sidebar, change the specified text in the function called ‘widget_myWidget’. The remaining code inside this function should remain as is to comply with the look and feel of your theme.
The last function initializes the widget and registers it with the WordPress system. The last line sees to it that the widget code is run when the plug-in is active.
This topic may be a little bit advanced for some. If you are having any difficulties or would like some assistance, please feel free to contact me and I can give you some assistance.
We provide simple, easy to understand web design services and web site hosting, specializing in Wordpress and Shopping cart applications. With 10 years of experience in Online Marketing and Search Engine Analysis, we can show you how to maintain good visibility for your online presence at a cost that won't break your budget.
6 Responses to Creating Your own Wordpress Plug-in and Widget
p | Digg hot tags
December 29th, 2008 at 11:54 am
[...] Vote Creating Your own Wordpress Plug-in and Widget [...]
Creating Your own Wordpress Plug-in and Widget : PluginZilla
December 29th, 2008 at 4:51 pm
[...] is a new post at Creating Your own Wordpress Plug-in and Widget Until now, whenever I needed to have something displayed on the sidebar of my WordPress blog, [...]
pressitfor.me
December 29th, 2008 at 7:42 pm
Creating Your own Wordpress Plug-in and Widget | Web Services and Tools…
Until now, whenever I needed to have something displayed on the sidebar of my WordPress blog, I simply input my HTML code into a Text Widget and added it to the sidebar. This worked fine until I needed something with a bit of intelligence to it.
But w…
Reality Raver
January 12th, 2009 at 5:34 pm
Hi
Great blog, I love the arthemia theme. I am going to be using it for a new blog I am doing. Is it an easy to use theme?
The other thing is I reallly like your share this widget with Digg this, technocrati etc, which plug in is it?
Eric
January 12th, 2009 at 5:43 pm
Thank you RR,
We had to customize it a bit before it went live. To do this, I used the XAMPP distribution to recreate my blog on my home computer.
Once I was happy that all of my custom changes were working, I made the necessary changes to my online database.
Then I uploaded the theme with no troubles at all. Just some minor tweaks.
The share widget that you see at the bottom of each post is actually a part of the theme as well.
Thanks for visiting,
E.
Daily Digest for 2009-02-10 - maeghan
February 11th, 2009 at 1:39 pm
[...] Creating Your own Wordpress Plug-in and Widget | Web Services and Tools [...]