Last year, John Saddington wrote a piece for WP Daily (R.I.P.) about the plugin MotoPress, which led to a rather interesting discussion about drag and drop functionality in WordPress. MotoPress has since refined and released a version of their plugin, and I thought it might be a good time to revisit the plugin and the issue.
MotoPress Content Editor
Think of MotoPress as a drag and drop post editor. Basically, you create a new post, then click a button to enter the “MotoPress Content Editor,” a unique editor where you can drag and drop various components into place. There are quite a few components available, like sliders, buttons, headers, video embeds and even archive listings of posts and categories. For each component, you can either create a new row, or place it next to an existing row, and then customize its content.
When you are finished with the editor, MotoPress generates a series of shortcodes, which it then places into your post. This is how the output is generated. In general, it will be difficult to edit these contents from within the WordPress post editor, so you’ll want to edit existing content through the MotoPress editor.
On the front-end, MotoPress actually does a good job of keeping everything pretty lightweight. It uses tested open source libraries, like WooSlider’s jQuery Flexslider, and only a tiny bit of minified CSS in order to create the layout. After digging through the code, I see no reason why it wouldn’t fit into just about any theme. Widths and containers are defined by percentages too, so it’s responsive and mobile ready, but it will still fit into a fixed width theme.
The Good and the Bad
From a usability perspective, MotoPress definitely gets a solid vote of confidence from me. It was pretty easy to get up and running, and it’s not bogged down by lots of options and features. It is simply for laying out a post with some extra interactivity and functionality, and it does that pretty well. It gives the user some control over structure,but only as much as it has to, making it hard to break the theme.
Still, I caught a couple of red flags. First, I noticed that when adding the archive component, I couldn’t see any links. After a quick investigation, I saw that this was because the plugin really is adding widgets. I had white links set-up on widget areas, but a white background in my post area, so they looked invisible. In the Settings menu I found a place to inject custom CSS though, so that helped.
In addition, when copying and pasting text from other sources, it would inherit the copied text styles making the typography inconsistent. For a client that is often copying from a Word document, this can be problematic. You also lose the new autosave features that have been core to WordPress. I didn’t run into any problems myself, but I understand that this can be a problem.
Still, the problems were fairly minor. If you’re looking for a drag and drop post editor, I think MotoPress gets the job done. But it does raise another question: Should you be looking for a drag and drop editor?
Why We Look Down at Drag and Drop
The last time MotoPress was reviewed, there was some concern from the community about drag and drop systems in general, and whether they are beneficial to the WordPress ecosystem. In truth, there are two problems. The first has to do with it’s implementation. Drag and drop system tends to inject seemingly unnecessary and bloated code in order to cover all bases (like the white link on white background problem). The second problem has nothing to do with implementation and everything to do with how they are used. The freedom of such a system can lead users to hack together badly designed pages rife with inconsistency and off-brand aesthetic.
The second point, that users can basically do too much, seems more valid to me. As designers and developers we spend a lot of time creating a site that is structured, maintainable and well designed. And this can pretty much go out the door when users can select fonts, colors and layouts. Drag and drop gives clients the false sense that they are editing a Word document, and that any and all changes are welcome. In reality, we live in a device-independent world, where websites are often run by several individuals. If everyone brings their own design eye to the table, things can get messy quick.
How We Fix These Problems
Here’s my ideal scenario for a product like MotoPress. Because despite my hesitations, I do think it could be a valuable tool if used properly.
First, build your WordPress site, just like you would any other. Start with a [static HTML prototype], then move it to WordPress, filling it in with content that has been handed over by the client.
Then, build a styleguide or design system; an aesthetic ruleset, on par with Dave Rupert’s tiny bootstraps for every client. Education is our number one tool when it comes to clients. We need to set the ground rules early and often so that whoever will be interacting with the site knows that even though they can change things doesn’t mean that they should.
At that point, and only at that point, drag and drop functionality should be added. It can be useful for a client to be able to visualize their content, and add extra features without needing to memorize shortcodes or hammering the “Preview” button. For clients that are unfamiliar with web technologies, it’s a valuable tool and one that can make the onboarding process easier and your support inbox a lot less full. That is, if we’re smart about it.
Am I imagining a dream scenario? Maybe. But I don’t think drag and drop systems are at fault. My final word on MotoPress. It has some problems, but it’s well-designed and fairly lightweight. It’s up to us to use it properly.
MotoPress is available for $29 on their website.
Anybody else use MotoPress? What are your thoughts?
Jay Hoffmann is a WordPress developer hailing from NYC. In the strictest sense of the word, he is a WordPress enthusiast with an eye for front-end development and design. He has been working with WordPress since 2006 and currently works for a popular children’s media company. This year, Jay started Tidy Repo, a curated list of the best and most reliable plugins from around the web. You can also follow Jay on Twitter.