This is a long post about how we arrived at building two new plugins. We need beta testers for one of them. Please read the whole thing to understand more or less what the plugins do.
Gutenberg – The New WordPress Editor
As you probably know, at some point soon, Automattic is going to replace the WordPress editor with a new one called Gutenberg.
Many users don’t feel this move is necessary as they either prefer things the way they are, or have already invested in 3rd party page builders like Beaver Builder.
However we may feel about it, Gutenberg will eventually replace page builders and theme editors. For sure, it won’t be anytime soon, but that goal is on Automattic’s road map.
Why does WordPress need a new editor? Because they want stay ahead of products like Wix, Weebly, Squarespace and even, Medium. Right now 30% of sites online are running on WordPress, but there are still 157 million small businesses without websites. Automattic want most of those to use the WordPress platform, and not the competition.
You can read about Matt Mullenweg’s vision here. It was an interesting read, but I am left hoping that Gutenberg will encourage paragraph breaks.
You Can Try Gutenberg Now
Automattic have said Gutenberg will enter the WordPress core by the end of the year (2018). That means now is a good time to
see what you think of it get used to it.
Fortunately we don’t have to wait for it to be officially added to the core. Gutenberg is available right now, as a plugin on the WordPress repository. Bear in mind it is only in beta, so avoid using on production sites.
I’ve tried it, and as someone who is happier writing content using HTML and CSS, it wasn’t for me. Automattic seems adamant that Gutenberg will not be something we can switch off indefinitely.
Despite my initial impression, I think I’ll eventually fall in line. Gutenberg promises that plugin developers will be able to seamlessly integrate new functionality into WordPress, in better, user-friendly ways, and that is a good thing.
I am not sure if the text editor will remain a definite, separate option – or if we want to type HTML we’ll be forced to use Gutenberg HTML blocks. It’s not clear. I have read that Gutenberg will allow shortcode blocks so we will still be able to use those.
Whatever – all plugins will have to be coded or re-coded to support Gutenberg at some point soon. Given that many WordPress plugins are free, I wonder how many of the free ones will be able to justify doing the work involved. Gutenberg will disrupt.
My Food/Recipe Site
Speaking of plugins, this brings me to the next thing. I’ve been trying to start a new website for the last 6 months. But work keeps getting in the way and my plans to go live with it have been delayed.
My new site is a food blog. When I started putting it together, I realised it was the first site I’d ever written, where photographs were going to be largely ones I’d taken myself, count as real content, and not just be stock images.
How My Site Will Use Images
I put a lot of thought into how I wanted my site to look. I think if you want a site to earn its keep, it has to be simple, easy to navigate and full of content people want. So I aimed for something simple, rules-based and well-organised.
To that end, for each recipe post, I have planned to have:
- Several original photos of the food itself, each branded with my logo in the bottom right hand corner.
- A featured image selected from one of the photos in the post, to represent the post around the site.
- A specifically created social media image for use on Facebook and Twitter, with some catchy text overlaid
- Specific image(s) for Instagram
- Specific images for Pinterest – maybe a composite of several images
- A decorative strip image (wide and narrow) at the top of each post, cut from the image I’d used for Facebook
In terms of the bottom right hand corner logo branding I quickly realised that some images require a black version of the logo (or it can’t be seen) and some a white one (or it can’t be seen). In other words the colour and opacity of the logo needed to be decided on a per image basis.
I needed to come up with several designs or formulae for the composite images for use on selected social media platforms. Something where I could make a pattern and say to someone, create these composite images for me without them having to make design decisions.
So maybe one design would be four images arranged as a grid and divided by lines of a certain colour about 10px wide, and in the middle of the grid a small square overlay of solid colour with the recipe name on it. That would be a design that could be repeated for many recipes where I wanted to feature 4 photos. Of course I could think of other layouts too.
For a non-recipe post, I still needed a
- Maybe one image branded with my logo, but possibly no images if the post does not require one.
- A featured image to represent the post around the site.
- A Facebook/Twitter image
- Instagram image(s)
- Pinterest images(s)
- The decorative strip image for the top of the post based on the Facebook image.
Manipulating Images Is Hard Work
My WordPress theme design was based on three “corporate” colours. That lead to the idea that each of the decorative strip images at the top of each page or post should be taken from the same image that I used for the Facebook image, but altered such that their hue matched one of my corporate colours.
Of course, each image would have to be resized, optimised for file weight, and maybe cropped too before being used.
I want this food blog to do well and I know that won’t happen if I don’t get a posting strategy both to the site and to social media worked out. I also need the content to be original and well presented with a simple but polished layout. I thought, with the plan above, I had the image part of this all worked out.
But I was to discover that apart from coming up with recipes and writing content, organising all that graphic content would be onerous. The graphic element meant a lot of fiddling about in Photoshop.
There was also no way I was looking forward to storing all those images in the WordPress media library. If I did, I’d be unable to find anything, and also I’d be making my WordPress database a lot bigger, crammed as it would be with multiple and futile references to image attachments.
Many recipe plugins exist, but I wanted one that produced good quality, full (well as full as possible) JSON-LD markup, and also automatically calculated nutrition data. I wanted one that didn’t try to format the layout of the recipe for me and didn’t force me to use the Visual Editor.
The look and feel of the recipe and the JSON-LD markup of the recipe are not connected and I’m not sure why many recipe plugins got involved with styling. Some also insist you use the media library and if you don’t, they don’t work.
Better Solutions For Images
After writing just two posts I realised the image processing task had to done another way. It was way too time consuming to do it manually. So I looked around online for others who’d had the same issue. It didn’t take long to find a couple of sites with far more ambitious image requirements than I had, who’d already solved the problem.
They’d used an API (set of programmable calls) to programmatically create the image layouts they needed. Like me they had decided all their image designs up front for a uniform look and feel. However they had developed their own solution by writing their own code. Although the image processing API provider they’d used also supplies an interface, (with a WordPress plugin to make it easier) it were only suitable for doing simple image processing.
More complex images would require code or at the very least, very lengthy and complex URLs. Even if your requirements were relatively straightforward, and you used the API via the supplied WordPress plugins, it still represented too much work as there was a lot of clicking and value setting involved.
Some of the image layouts I described above, and some of the ideas I had in my head for images, could not be easily achieved by using the supplied WordPress plugins. They required programming. So I was back to having to do them all manually in Photoshop.
A Better Solution For Recipes
The next thing I needed was recipe plugin. Recipe plugins automatically apply JSON-LD markup to the recipes you type in, so that Google understands them better and officially recognises them as recipes. To find a suitable recipe plugin, I researched all the popular ones and bought the one that looked best.
When I installed it, I found that the video on the plugin author’s home page had given me the wrong impression. The video had implied a feature I very much wanted, existed in the plugin. But when I tested the plugin out, the feature wasn’t there. Of course the plugin developer had not been deliberately misleading. Rather, I’d been so keen for the plugin to have the aforementioned feature, I’d elevated what turned out to be mere artistic license in the sales video, to imply the feature actually existed. It didn’t.
When I emailed the recipe plugin developer to say, “where is feature X – your video said it was there”, he wrote back to say that his video had not implied any such thing, and how could I expect that feature anyway, as it was impossible. My feeling was that the feature I wanted was in no way impossible, you just had to think about it a little differently.
I found myself with no recipe plugin and a lot of image manipulation work to do.
Two New Plugins
So I asked Russell (my husband) if he could do something. Russell has already written a number of WordPress plugins, so I thought one more wouldn’t be too much to ask. But it turned out to be two more. He wrote a recipe plugin, (gonyam) for me containing the “impossible” feature, and also the image processing plugin, (wpmagix) based on the particular API service I’d researched.
Both plugins are in alpha. I am using them on my site now, and if I can get the client work out of the way I’ll be able to publish the new site sometime soon. The plugins have made the job easier.
The image plugin is a joy to use. All I have to do is get an image – it can be straight out of my camera – absolutely huge and weighing 3mb. It does not matter. I present it to the plugin, then refer to it using a shortcode wherever I need it, and that’s it as far as the work for images goes. All images for the page itself are created and placed, and responsive, and all social media images can be downloaded, ready to use, or associated with individual posts as OG images.
The recipe plugin is equally easy to use but if we decide to make that available, it will only be so as part of a web design service for food bloggers.
Beta Testers Wanted for WPMagix.
WPMagix doesn’t yet work for Gutenberg, but if we can create enough interest in the plugin, Gutenberg block support will be added.
Right now it functions with the text editor and shortcodes. There is no point integrating with the visual editor as it will be no more by the end of the year.
WPMagix is in alpha right now with no cloud component. However we are working to produce the beta version which will be implemented in the cloud.
To find out if the image plugin has legs, we’d like to invite some beta testers to use the beta version when it is ready. Only apply if you
- are prepared to use the software and give feedback.
- happy to use the text editor for your site content (no support at this stage for Gutenberg or other visual editors)
- happy using shortcodes
- have an Amazon S3 account