Editing Blog Content w/ Google Docs

Webflow's Editor leaves a lot to be desired. For a content producer, it has some major gaps.

• Fragile interface that is difficult to navigate
• Zero version tracking
• Inability to revert versions or undo changes
• No realtime collaboration abilities
• Device-access limitations. You can only use Webflow's editor on a desktop browser.

But at the same time, it's so nice to see your article content in exact WYSIWYG form.

Here's how I approach it.

Google Docs

For the initial writing, I use Google Docs to capture all of my content. In addition to all of the above needs;

• It has built-in voice-to-speech
• It has a great headings outline
• Styles are simple and on-par with Webflow's rich-text element

Overall, this works pretty well.

I write 80% of the article in Google Docs, then copy it over into the Webflow Editor to complete writing and formatting tasks.

Pro Tips

Copy-paste works great for most of the content.

• Paragraphs
• All heading levels
• Lists, but ordered and unordered
• Links, bold, and italics

If you have a particular blog, etc that you write a lot of content on, you can mimic some of the fonts and styles in a Google Docs template so that the editing experience is somewhat WYSIWYG.

Some elements must be created by hand after pasting;

• Any HTML embeds
• Blockquotes

Accessing the Editor

If you are the Website Designer, it's a pain to access the Editor. You must log into the designer dashboard, and then click into the site's editor view, and you're on the homepage.

This is very inconvenient if you just want to make a quick edit- and you cannot use your Webflow login in the editor. So bogus.

If your site is hosted and you have available editor accounts, create one for yourself. You can use a different email and password combination, and if you're using e.g. Chrome, you can just set it to remember them.

Then, editing is as quick as visiting the page you want, adding ?edit to the URL, clicking Log in. A few seconds later, you're editing away

Viewing v. editing

When you're in Editor mode, Webflow is very particular about having multiple tabs open on the same computer, with the same site.

Save often.

Saving is done by clicking outside of the rich text area.

If you're writing content or making a lot of changes, this is essential to do frequently because if;

• You free wifi access expires at your cafe
• Webflow logs you out for any reason

You've just lost all of your work.

Draft mode bug

If you're viewing a drafted page, and get logged out, the draft page will appear as a 404. The only way to get Webflow to show it again for editing is to switch to a different page in the editor, and then switch back.

Workflow

Writing;

• Do initial writing in Google Docs, to 80%+
• Collect images, PDFs, etc, that the article needs separately. Store them in the same Google drive folder ( I create one per article )
• I also collect Google Sheets of things like reference lists
• Other Google Docs can be used e.g. HTML tables that you want in your document

Preparing;

• In the Editor, create a new blog entry or collection item
• Populate all of the fields you will use, even with placeholder content if needed. This makes certain that the elements are accessible in the Editor view.
• Switch to the editor view, and do your WYSIWYG work.

Publish!

‍

‍