When it comes to editing and crafting content on the go, the WordPress Mobile apps are a good choice. The question is, how does the editor in the iOS app interact with content written in Gutenberg? Let’s find out.

Quick Edits Turn Into Lengthy, Frustrating Fixes

For testing purposes, I used a simple scenario that many users may run into. I’ve written and published a post in Gutenberg using paragraph, unordered lists, and image blocks. I then used the WordPress for iOS mobile app to access the post, correct a typo, and save it. The goal is to see if content is affected by saving it in a different editor.

Here is what the content looks like written and published in Gutenberg.

firefox_2018-04-24_18-44-13 WordPress for iOS and Gutenberg Don’t Get Along design tips
Content Written and Published in Gutenberg

Here is what the post looks like in the iOS app. It displays what appears to be Comment shortcodes at the beginning of each paragraph.

img_1212 WordPress for iOS and Gutenberg Don’t Get Along design tips
Gutenberg Content in WordPress for Ios

After correcting a typo and saving the changes, this is what happened to the post. As you can see, what was supposed to be a quick fix has turned into a lengthy process of fixing the entire article in Gutenberg.

firefox_2018-04-24_18-55-37 WordPress for iOS and Gutenberg Don’t Get Along design tips
Content Written in Gutenberg After Editing in the WordPress for iOS App

All of the content runs together as one giant block. To say that this is frustrating is an understatement, especially if you’re on the road and don’t have access to a desktop or tablet that can load the WordPress backend. 

Here is what the content looks like in Gutenberg after saving the edits in the iOS app. There are large gaps and a few of the blocks have warnings stating that they appear to have been modified externally.

firefox_2018-04-24_18-58-41 WordPress for iOS and Gutenberg Don’t Get Along design tips
Content in Gutenberg After It Was Edited in the WordPress for iOS App

Clicking the convert to block buttons turns the messages into blocks but it doesn’t return the formatting and in some cases, content goes missing. Before editing in the iOS app, this block contained a quote with a citation. Now it’s empty.

firefox_2018-04-24_19-04-48 WordPress for iOS and Gutenberg Don’t Get Along design tips
Quote Block Is Missing Content

WordPress has post revisions so I was able to quickly restore the breaking changes introduced by the iOS app. But this user experience between Gutenberg and the WordPress for iOS app is a great example of how something so simple can easily turn into a perceived disaster by users and ultimately, tarnish the new editor’s reputation.

Searching the Gutenberg repository on Github for iOS produces some results, but none refer to the compatibility issues I experienced.

I found out the hard way and will not be making any more changes to posts written in Gutenberg in the iOS app until compatibility between both editors exists. I recommend you don’t as well unless you want to fix a lot more than a typo.