Skip to content

Idea Publisher: My first WordPress plugin

Posted in Development, and Experiences

A few months ago I had an idea, I use a diverse set of social platforms from LinkedIn to Twitter to Minds. However, the latter does not have any support to publicize blog posts, even WordPress. Between the various travels and generally busy weeks around work I didn’t get much time to work on this. Eventually, I managed to create this plugin just in time for getting some Hacktoberfest points and allowing people to get some by participating. Here is the story of how I created the Idea Publisher.

My Minds.com profile

At first, I had a look at the Jetpack Publicize plugin which allows me to share posts to Facebook, LinkedIn and Twitter upon publishing a new entry. Most of the useful code I came across was deprecated, at least according to the WordPress development resource website. Still, going through the Publicize plugin proved useful as I understood the gist of what I needed to do. First, I needed to figure how to authenticate to the target social media, in this case Minds.com. Then, I need to implement a method hooked to the post publishing hook. Finally, once the I intercept the post, I get information from it and publish it to the socials! Easy enough isn’t it?

The first step of the process consisted in scooping through the Minds API to figure how to authenticate. Luckily for me, Minds.com prides itself in being an open-source platform with all the code available on GitLab. From there I went and browsed the backend engine to try and find the authentication endpoints but could not find them. At some point I realised that if the backend code was on GitLab, so would the frontend and maybe even mobile app code. And it was!

From there, all I had to do was finding where they hid their authentication form and browse links until I find the authentication service. Once I found it, I was happy to see that they use good ol’ OAuth2 which I am familiar with. Also, as a bonus, I won’t need to store credentials so that’ll be a plus on security, only tokens. Refresh tokens can be used to refresh the session so that the future plugin users won’t need to ever put their credentials after the setup. Well, that’s assuming that they regularly publish blog posts but I’ve seen a bunch over there that do.

I could use a library to implement the authentication but I do want to keep things lightweight so I manually wrote the authentication code. It’s all straightforward HTTP requests using JSON, definitely not rocket science.

Once I got that part down, I wrote some admin UI code to test that the connection worked well enough. Creating the authentication form was fairly easy, just a bit of HTML mixed with PHP and voila!

Idea Publisher authentication form for Minds.com
Idea Publisher authentication form for Minds.com

Now that I got my form working, I need to write some code I can plug the UI to the authentication functions I wrote. Eventually, I got something that behaved as I wanted. Something that would show my Minds display name, profile picture and a disconnection button. Simple enough, this is still version 0 but we’re progressing.

idea publisher greetings screen
Profile greetings after authenticating.

Now that I can authenticate successfully and keep the authentication tokens secured, I can focus on the ultimate goal: Publishing.

Now, in order to publish a custom message, I need someplace to display some sort of input. Ideally just as I hit the Publish button. My early digging into the Jetpack Publicize plugin showed me some interesting bits, which I copied to try and get a popup input. I deploy the plugin onto my local environment, draft a post, click on Publish and nothing. Over and over, reading through making sure I wrote the same code as Publicize but still nothing. Think that I context-switched for weeks between travelling between France and Egypt for about a month with only a weekend in between to look at this code. Since I had limited time to look at this each month, it took forever to understand what was wrong.

Then one day I decided to take some time to read through all of the WordPress documentation about the Gutenberg editor. This was going to suck but I had to do it. It took some time but eventually I saw it, it’s all JavaScript. Well, mostly. The code I copied from Publicize is code that only works for the legacy editor.

However, in order to have the same behaviour, I need to write a bunch of JavaScript then load it separately. Unfortunately, all the examples are in JSX and I don’t want to bother setting up such thing when I’m still writing extremely dirty code with no class in sight. This is when luck strikes again, I found a GitHub repository with a bunch of vanilla JS showing me the way. I could resume the work.

idea publisher message box
Pre-publishing box, if left empty some other stuff will be published, don’t worry about it.

After finally getting my magical pre-publishing box, I need to figure how to pass data down to the rest of the plugin. From there I can extract it alongside some post information to create a Minds post.

Once more, I went to the Minds mobile app code and found the publishing method. Still a good little HTTP call using some JSON. Within a few minutes I wrote some very dirty code, as I had so far, and got something functional. I could finally share blog posts from WordPress onto Minds.com.

Still, the journey was not over yet. I want to make this open-source as a double-whammy where people can help improve it and getting Hacktoberfest points. This requires some clean up. And by some, I mean all of the cleaning up you can think of.

At this point, I am still writing extremely dirty code. Not just because it is PHP but there are no automated tests whatsoever. The problem is that I am limited in time but still need to rewrite codebase into something maintainable.

A few years ago, I wrote a blog post about making API testing great again using Postman. The idea was to have some external tool you can write some validation against for your API before changing it. That way, even if you rewrite everything, you still have your original behaviour captured and can test against that. Here we can do the same thing using UI tests. The last time I wrote UI tests was back in 2016 I believe using C#. These days were far behind me but still I remember the principle. Still, I couldn’t bother to write these tests from scratch so I searched and found Selenium IDE.

Selenium IDE (SIDE) basically allows you to record your interaction with a given browser window. Once you stop the recording, SIDE creates a reusable script even thought it is not really human readable. Fortunately, it proved to be a solid starting point as it allows exporting into a friendlier format. I exported these tests into Mocha JS tests and some tweaks later, I had something usable.

The tests allowed to validate that I could still install the plugin and authenticate. Unfortunately, the test I manually wrote to try and share a post did not work. It could be because of some Selenium Webdriver feature that causes the browser to not generate JS. I have no idea but eventually dropped the test. The other two would have to be enough.

In order to run my tests consistently with reliable results, I made some modifications to the code so that it speaks to a fake Minds.com. I achieved this by using WireMock, check it out, very useful to validate code that interacts with external APIs.

Writing classes was fairly straightforward once I could split down the concerns. Within half a day I had my classes and ran the UI tests against a newer, cleaner plugin. They instantly passed. From there I manually tested and went all the way to publishing a post and it worked as well. I could finally create a repository and share the code with the world.

As I was writing the README file to describe what the project is about, I felt disappointed that in there I pretty much wrote an apology for coupling the WordPress HTTP implementation with the Minds HTTP client class. At first, I thought I should implement the cURL library but couldn’t be bothered. I spent too much time on this already and decided to enjoy my weekend for the first time since returning from Egypt. Probably been 2 weekends by then.

Still, on Sunday the idea of leaving this alone started to drive me crazy so I changed the code to decouple these two. The plugin would still use the WordPress HTTP implementation but now we inject that dependency. Since this is open-source anyone can open a merge request in order to add a more generic implementation to support more publishing platforms like a Joomla.

Finally, you reached the end. Thank you for reading my first official blog post shared to Minds via the Idea Publisher. This was a fun challenge and now I have one for you. The plugin still has no logo because I focused on making it work. I am offering 300 off-chain or 200 on-chain MINDS tokens to whomever can come up with a design.

Poor logo-less plugin

Feel free to try the plugin: https://wordpress.org/plugins/idea-publisher/

You can also contribute to the project on GitLab: https://gitlab.com/naggernation/idea-publisher

Be First to Comment

    Leave a Reply

    This site uses Akismet to reduce spam. Learn how your comment data is processed.

    %d bloggers like this: