The creative process is something quite difficult to understand. There are days when you write content for your blog without any problem. Everything flows and nothing distracts you from your task. But this doesn’t always happen, to our dismay ?
Most times, when you are writing content (or trying to), the flow is gone and anything can distract you. A notification on your smartphone, a new email, someone who comes in or leaves the office, a fly… anything!
Now that mindfulness is so trendy, let’s see how we can convert our WordPress editor into a distraction-free environment so that it is easier for us to focus all our attention on the task we are doing: write.
The Distraction-free Mode in The WordPress Block Editor
The WordPress block editor, also known by the codename Gutenberg, has changed the content editing experience we were used to from top to bottom.
Now you have every piece of content represented by an individual block. These blocks can also be modified in several ways: some have options in the right sidebar in addition to the upper floating toolbar.
In fact, we now have two top bars, as you can see in the previous screenshot. One of them is located at the top of the editor and allows you to save the content, among other things. The other top bar is the one that appears just above each block, floating on top of it.
Unifying The Upper Block Toolbar
We can merge the top bar of the WordPress block editor and the top floating toolbar of each block into a single bar. To achieve this, you just have to click on the icon with the three vertical points that you will find in the upper right corner. This will open a floating dialog where you have to click on the Top Toolbar option.
The result is much better, IMHO. Now the two bars are at the top of the WordPress block editor. I don’t see any point in having the block toolbar floating above the block when you can have it always in the same place, on top of the editor.
Nelio A/B Testing
I was very impressed by the quality of this plugin, how easy it was to set up, and the outstanding support Nelio provides. I highly recommend Nelio A/B Testing.
Josette Millar
The Spotlight Mode in Gutenberg
In the WordPress block editor every time we click on a block it is highlighted with a border and its sidebar is shown with the options that the block itself has. If you want to highlight the active block in a more subtle way and reduce the relevance of the rest of the blocks you are not editing, you can do so thanks to the Spotlight mode that Gutenberg includes.
Re-open the floating dialog that appears when you click on the icon with the three vertical dots and there you will find the Spotlight Mode option. When you activate it, the active block will be more prominent than the rest.
In the previous screenshot you can see the result, where the active block is the first paragraph. The rest of the blocks have a less accentuated gray color to take away their relevance. Thus, you are not distracted by them and may focus on the active one.
The Fullscreen Mode in Gutenberg
We’re almost done. Now we’ll eliminate all aspects of WordPress that have nothing to do with the block editor itself. To do this, you must activate the fullscreen mode of Gutenberg.
You do this, again, by opening the floating dialog and clicking on the Fullscreen Mode option.
Once you activate it, the left sidebar of WordPress as well as the top bar of the Dashboard will both disappear. This leaves all the window space to the WordPress block editor itself. And you won’t get distracted by update reminders or plugin notifications.
Anyway, there is something that we have not removed yet, and it is the right sidebar, which belongs to the editor itself. But this is quite simple to do. You just have to click on the gear icon or press the Command Shift , key combination on Mac or Ctrl Shift , on Windows.
The result, which you can see in the following screenshot, shows a much simpler and cleaner interface. It is now much easier to focus on writing without distractions from the interface of the WordPress block editor itself.
But not everyone has switched to the new block editor, right? ?
The Distraction-free Mode in The Classic Editor
If you are a member of the resistance against the WordPress block editor, or have not yet made the leap to the new editor, be aware that the classic editor in WordPress also includes a distraction-free writing mode. To activate this mode, just click on the icon that appears on the right side of the top bar of the editor, the one with 4 arrows expanding, as you can see in the following screenshot:
You can also activate distraction-free writing mode in the classic WordPress editor with the Shift Alt W key combination on Mac or Windows.
Even though the result is not perfect –to say it in an elegant way– the interface eliminates everything superfluous to avoid distractions.
And BTW, you should give the new block editor a chance. It has improved a lot and will allow you to do many more things more easily ?
Without Distractions, Focus on What Matters
Avoiding distractions is at your fingertips if you use WordPress editors to write your content. Here you have seen how turn a complex interface into something cleaner.
But this is not a silver bullet: if you get distracted all the time, perhaps it is better to postpone your writing activities until you have some spare time. Find those moments in which you can focus and use them to write.
Are you one of those who get distracted a lot? Have you focus problems when writing? I would like to read your experience in the comments.
Featured image by Samantha Gades on Unsplash.
Leave a Reply