Creating my first v2.x plugin

by admin in Blog

Not only have I been working with the team to make sure we could get the first alpha out - which I’m hoping everyone is enjoying so far - I've also been preparing my first v2.x plugin called 'Owe Me!

Not only have I been working with the team to make sure we could get the first alpha out - which I’m hoping everyone is enjoying so far - I've also been preparing my first v2.x plugin called 'Owe Me!'. The code is located here:

Owe Me! is a very simplistic plugin that creates an overview of money that is owed to you by others (be it friends, family or whoever else). It can I thought of creating this when several family members and friends still owed me some money and both the paper as well as my mental notes seemed to disappear real quickly. You know the feeling?

By means of this blog post, I would like to share my experience of building a v2.x plugin considering my limited PHP experience. I can do some basic editing which is the reason as to why I practically refrained from working on v1.x plugins before. It turns out, my limited PHP skills are sufficient enough to create a v2.x plugin. I hope this inspires and encourages you to try it out yourself as well!

Amongst the many amazing new features in v2.x which I highlighted in one of my previous blog posts, the plugin builder is a great tool that will be of significant use to you when you want to develop a plugin. It will generate most of the new code for the admin-area of your plugin based on your database structure. The tool also generates the new plugin.xml meta-file, which is used during installation of your plugin.

Using this tool has several advantages:
- There is no need to code in the HTML or the process of reading and/or writing to your database (which was still needed in v1.x). On top of that, your interface is consistent with the rest of admin area which makes it easier for end-users to use your plugin.
- You can easily make full use of features such as the media-manager, userclasses, drag-and-drop sorting, batch and inline editing and so on.

Let’s take a closer look at what I did to create the plugin:

1) The first thing I did was thinking about the database structure of my plugin. I found this to be the most important step of the entire process as the database structure is the basis of your plugin. You need to think about how you would like the data of your plugin to be structured.

For example: the Owe Me! plugin has one main table (which contains the ‘entries’) and three other tables: debtors, categories and statuses which contain information about each of these sections. I used these different tables as I wanted the users of my plugin to be able to define their own debtors, categories and statuses.

I used a database tool called phpMyAdmin to actually create the structure. Most webhosting providers offer this tool. More info on phpMyAdmin can be found in this great tutorial:

2) A simple export of my database (again through phpMyAdmin) was all that was needed to get the contents of my oweme_sql.php file. Simply put the table structure in your *_sql.php file. Example data can be added using the *_setup.php files. (* = your plugin folder name)

3) I selected my plugin folder (oweme) in the plugin builder and it showed me some options like which column names needed options such as batch or inline editing, which columns could be filtered and which columns were displayed or hidden by default.

4) After the plugin builder generated the admin interface of my plugin for me, I had to make some minor and simple changes to make sure the dropdowns in my main area were pulling data from a different table in the database (e.g. the ‘debtor’ dropdown needed to pull data from the debtor table in my database). This is done through the init() function, which is actually really easy to use. Examples can be found in the FAQ plugin, or even in my plugin if you like!
At the same time, the plugin builder had also created a basic plugin.xml for me which I slightly edited afterwards to suit my needs.

5) I then started working on the frontend of my plugin. The frontend is the actual area on your website that users can see. In my case this is a simple table that shows all the Owe Me! entries.
The integration of Bootstrap and jQuery made it real easy for me to style the table. It instantly looked consistent with the rest of my installation which was quite a relief when thinking back about how this had to be done in v1.x.


I had then finished my first simple v2.x plugin and I actually enjoyed creating it. I may be biased, but this is such an improvement from all the manual and inconsistent work that had to be done when creating a v1.x plugin. The plugin builder created the basic files (admin_config.php and plugin.xml) so I could focus on the frontend of my plugin.
I am no PHP expert and yet I did manage to create my first plugin which got to count for something, right?

I plan on expanding the Owe Me! plugin to include some new features and make it a little more customisable (e.g. some preferences to set for example the currency). I’ll also be adding LAN files so users are able to translate the plugin into their own language. Feel free to contribute by testing and submitting pull requests to the Github repository. You can also star and/or fork my project to spread the word. Pull requests are welcome!
I’ve added some screenshots below to give you an impression of the Owe Me! plugin (click to enlarge).

Oweme Admin Editentry


Oweme Frontend

Oweme Plugin Builder

Thank you for reading, feel free to let us know what you think about the plugin creation process and/or my plugin specifically.
I hope to see your v2.x plugin(s) sometime soon!


Social Links