Classic to Gutenberg

Edit A Classic Page – Convert to Gutenberg (Block) Mode

  • Users are strongly urged to proceed with caution when converting a page from Classic to Block mode. Unexpected results can occur, especially with “complicated” pages with images juxtaposed nest to text.
  • Gallery Content Gone? Exploring conversion of a Classic page, with a Gallery of images, Gutenberg caused the content of the Gallery to disappear, necessitating rebuilding of the Gallery!
  • Consider making a copy of the page to be converted and experiment with that until becoming comfortable with Gutenberg. (Such an experiment led to the above observation.)  BUT, the copy will have a different URL so it must be used to replace the original page, a difficult task involving copying HTML in Text mode.
  • It is easier to begin experimenting with Gutenberg on a new page.

With the above in mind,

  • Start conversions from Classic to Block by clicking on Pages on the black / left menu.
  • Files created with Classic have the — Classic editor annotation after their names.
  • An option to edit a file with the Block editor now appears under the page name.
  • To continue to edit in classic mode, click on
    Edit (classic editor).
  • Click on Edit (block editor) to change from Classic to Block.
  • It may seem a bit tedious to look at this whole page but doing so may well benefit a Writer or Editor.
  • This guide is intended as a basic introduction to converting a Classic page to a Block / Gutenberg page. Refer to Gutenberg Block Editor – Tips for more detailed / advanced tutorials.
  • Note: IMAGES of pages being edited appear below. Do not misinterpret them as having actionable icons that can be clicked.

To initiate edits with the Block editor (Gutenberg), click on Edit (block editor) for the page to be edited.

The following “Welcome” may appear. Click on Next to cycle through the welcome messages.

 

An option to view a “detailed guide” is also offered.

At the end of the cycle, click on Get Started.


The Block edit screen appears. (This example is taken from  a version of the Chess Club page.)


Convert to blocks appears.

  • Hover over Convert Blocks and it turns red.
  • Click on Convert to blocks to change the page from Classic to Block edit mode.
  • The following is an image.


This view appears


Editing Content – Brief Intro

  • In this example, the cursor was placed in the paragraph beginning with “Are you a . .  .” and left-clicked.
  • Note appearance of the text styling tool. Once can select text and apply a style, or, add / delete text.


  • In the view below, we have clicked on the image of a chess board.
  • Note the red lines that appear at its circumference, and,
  • image styling tools also appear, e.g, for alignment, cropping, etc.

In this view, we hover the cursor just below
the paragraph and a block addition line appears:
———+———  (blue)    or   ———+———  (red)  

Note that the line extends over the image block because the block insertion point is at the end of the paragraph block on the left, the bottom of which is higher than the image block content.


Clicking on the plus sign opens up the options to add a block and choose a type of block.

To insert a new paragraph at this point, click on the paragraph icon ( ¶ ).



A prompt appears to Type in text or choose a block


We choose to start typing in the space provided – where it says “Type or choose a block”  and the new paragraph appears.

  • The first part of the paragraph is wrapped to the left of the image because the block insertion point was at the end of the existing paragraph block.
  • Some “playing around” with positing of the cursor is sometimes needed to insert a block in the desired location


Now we have inserted a new paragraph, with styling options available.


Hover over the three-dot selector and more Options for the block appear, e.g., Copy, Remove Paragraph.


New  Block Page Creation

  • By default, creation of new pages is in Classic mode.
  • To create a new Block-mode page, click on Add New
  • This view appears. Switch to Block mode by clicking
    Switch to block editor.
  • Continue with the creation of a new page in Block mode.


Copy A Block

Refer to Gutenberg Block Editor – Tips
to learn about copying a Block.


Finishing / Saving

When editing is complete, save work with the appropriate action.


Closing Out After saving work,

  • Click the Site icon, far upper-left, to leave a page.
  • A warning appears if content has not been saved.
  • If the warning is ignored, edits will be lost.


Return