This is Part 3 of The Complete Guide To Writing a WordPress Widget Series.
At this point, we’ve got enough code written such that we can begin implementing certain aspects of our widget.
As mentioned in a previous series, iterative development is a great way to develop your projects (and it’s part of my preferred development methodology) so we’re going to be applying that to developing our Tweet It widget, too.
In this iteration, we’ere going to be working on the administration panel. Specifically, we’re going to outline the requirements of the administration panel, develop the look and feel, and then refactor some of the code.
1. Widget Requirements
The purpose of the Tweet It widget is to give users the ability to broadcast a message via Twitter that they are currently on your site.
Earlier, we said that we’d want to introduce the following functinality:
- If the user is on the main page, we broadcast the blog title and a link to the blog
- If the user is on a single post, then we broadcast the post title and a link
- We also want to provide the administrator the ability to force users to broadcast a custom message
This gives us enough information to go on to begin building out the administration panel, but before going any further note that by this particular point in the series your plugin should be visible in the WordPress plugin administration area:
If not, verify that all of your code is properly located in the plugins directory.
2. Brainstorming The Admin Panel
From the above requirements, the two primary options that arise are either broad information based on the blog or broadcast a custom message. The rest can be taken care of via code and calls into the WordPress API.
Regardless of if you’re working on a larger application or a simple widget, now is a good time to stub out what you envision for the UI of the administration panel:
As always, the look and feel is up to you. The above shot is a first pass of mine but the final version will likely change from this.
Generally speaking, there are going to be two radio buttons with labels. When the Custom Message radio button is selected, an input box will appear that allows the administrator to put in a custom message of his or her own.
Of course, that’s just my particular mockup. There are a variety of ways that you could do this and it’s worth exploring for a bit. If you end up doing this, feel free to share some of your ideas in the comments.
Once you’ve landed on an idea as to how you want to create the UI for the administration panel of your plugin, we can start building it. The next post in the will take us there.
[…] we’re going to be covering:Getting StartedUnderstanding the WordPress Codex and the Widget APIWriting Your Own WordPress Widget: Tweet It, MockupsWriting Your Own WordPress Widget: Tweet It, Iteration OneWriting Your Own WordPress Widget: Tweet […]