One of the advantages of running a plugin review site is that I come across some really interesting and functional plugins that nevertheless remain a little too hidden from the community. Over the past couple of weeks, I’ve been using one such plugin, PrettyPress.
If you have a content heavy website, like a blog, then you know that previewing your post can be a bit of a hassle. It usually means leaving two browser tabs open, one where you can edit your post, and one where you can keep the Preview open. Then, it’s just a matter of hammering the preview button and flipping back and forth between the two.
PrettyPress offers a solution by generating a side-by-side live preview of your posts and pages with a full editor and markdown support. And so far, in my experience, it’s been working very well.
Side By Side Preview
PrettyPress keeps everything pretty simple. It doesn’t change your workflow, it just enhances it a bit by adding a separate editor window that can be launched from any post or page. When you install and activate the plugin, there will be simple box added to the top of the right sidebar in your editor window with a single button: “Launch PretyPress.” This opens up a new editor, with the WordPress editor on the left, and a Preview of your site on the right.
As you start making edits to the editor, you will see the changes reflected in the preview immediately. And the editor should be more then familiar to you, because it’s simply the default WordPress editor. You can do anything you can normally do, upload images, apply styles and formatting, and switch back and forth between the Text and Visual Editor. There’s also a third tab for Markdown, but more on that later.
I’ve found that the plugin works best with responsive designs, which you really should be using at this point. The preview on the right will adapt to the proper media query and container size if you are using something that is responsive. Otherwise it’s a tad bit more awkward, though far from unusable. At any time you can click the pencil button at the top left of the editor to save or immediately publish your post. And there’s a “Back to WordPress” button in the top right, which will take you back to your normal post editor, with all of your changes intact.
A Few More Features
Beyond being an impressive preview editor, there’s a few smaller features that to me really stand out. For one, there are only two settings. You can either chose to turn off the editor altogether, or turn off the Markdown module. Lack of options may not seem like a feature to you, but when you’ve dealt with as many plugins as I have, you’ll find that this kind of simplicity is useful.
And then there’s built-in Markdown support. In the PrettyPress editor there is a third tab labeled “Markdown.” In this, you can use Markdown syntax to compose your posts, which will get converted to and stored as HTML. If you don’t know what Markdown is, that’s okay, you can easily switch the feature off. But it’s a nice-to-have and has been working perfectly as far as I can tell.
And just to add one more small, small thing. You can take the border between the preview and the editor window and drag it back and forth to make the editor smaller and the preview wider or vise versa. It took me about a week to notice, so here’s the heads up.
Gardening the Bugs
As a fairly new plugin, there are still some kinks that need to be worked out in PrettyPress. For one, the plugin makes use of jQuery to generate the preview. For extremely long posts, or posts with a lot of media, this can cause slow performance and lag. I haven’t gotten to the point where that has happened, but the way jQuery traverses the DOM, this is more then possible so be on the look out.
I haven’t found anything that has truly broken my site, just a few minor nuisances. For instance when I click the pencil button sometimes, the “Save” and “Publish” buttons appear underneath the text boxes for the editor, making them hard to click. And when I edit a post in the editor, and then return to the default WordPress editor, the text sometimes takes on a block formatting at a fixed width of whatever the preview was. Far from devastating, and I’m sure the development team is more then on it.
Other then that though, I would recommend using PrettyPress if you find yourself constantly struggling with a preview workflow. At the very least, I’m sure it will help speed things up.
Have you had any experience with PrettyPress? Let us know in the comments.
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.