# Blog

### The block editor’s workspace

#### Create a new post <a href="#create-a-new-post" id="create-a-new-post"></a>

To add a new post to your blog, take the following steps:

1. Visit your Dashboard.
2. Click on *Posts* on the left side.
3. Click on the “**Add new post**” button.
4. Give your post a title by typing it in the box at the top that says, “*Add title*“.
5. Start typing your post, or click on the **+ block inserter** icon to add new content. Learn more about [using the WordPress editor](https://wordpress.com/support/wordpress-editor/) to create your post content.

<figure><img src="https://content.gitbook.com/content/Z8Mj97WfpeafiANSF208/blobs/uvOjs2qiPnu7XS9Jn98l/image.png" alt=""><figcaption></figcaption></figure>

The block editor opens by default in fullscreen mode.

<figure><img src="https://content.gitbook.com/content/Z8Mj97WfpeafiANSF208/blobs/kNV0meDGmgEeGf3uTeBw/Screen%20Shot%202025-08-14%20at%208.50.07%20AM.png" alt="WordPress Block Editor overview"><figcaption></figcaption></figure>

The WordPress block editor workspace has three main sections:

* the top toolbar
* the sidebar with the post/page settings and the block settings
* the content area.

#### The top toolbar <a href="#the-top-toolbar" id="the-top-toolbar"></a>

Before you publish your post or page, you will see the following options in the top toolbar.

<figure><img src="https://content.gitbook.com/content/Z8Mj97WfpeafiANSF208/blobs/tTiexslKkmtIiUsa2wCm/Screen%20Shot%202025-08-14%20at%208.51.59%20AM.png" alt="Top toolbar showing available icons in post edit screen"><figcaption></figcaption></figure>

After the publishing, you will see the following options.

<figure><img src="https://content.gitbook.com/content/Z8Mj97WfpeafiANSF208/blobs/uFygQGgO1X5zTGbszPUH/Screen%20Shot%202025-08-14%20at%208.57.11%20AM.png" alt="After the publishing, new option View Post / View Page is appeared."><figcaption></figcaption></figure>

The options corresponding to the numbers in the figure are as followings:

**1. View Posts / View Pages**

Shows the W icon by default, or the Site Icon if available. Click to exit the editor and back to the list of Posts or Pages in Administrator Screens. This will prompt you to save the changes or leave the post or page.

**2. Toggle block inserter**

Show or Hide block inserter that allows users to add block, patterns or media to your post or page.

<figure><img src="https://wordpress.org/documentation/files/2019/03/block-editor-toolbar-3-6.8-553x1024.png" alt="Block options, patterns and media when clicking block inserter." height="1024" width="553"><figcaption></figcaption></figure>

**3. Undo and Redo**

Undo an action, or redo an undone action.

**4. Document Overview**

This option includes two tabs: List View and Outline.

* List View: a list of all of the blocks that are on the post/page and easily navigate between the blocks on your post/page. [Read more about List View tool](https://wordpress.org/documentation/article/list-view/).
* Outline: Show the the post/page details including the character and word count, estimated time to read, the number of paragraphs and blocks on the post/page, and the document outline showing the headings and how they are structured on the post/page.

<figure><img src="https://wordpress.org/documentation/files/2019/03/block-editor-toolbar-4-6.8.png" alt="A preview of the document overview showing outline tab content." height="990" width="698"><figcaption><p>Outline tab in the Document Overview</p></figcaption></figure>

**5. Edit with Elementor**

* Click the big **Edit with Elementor** button at the top of the page editor.
* This will open the Elementor visual editor.

**6. Command Palette**

The Command Palette helps you streamline your workflow in the WordPress editor by providing a centralized location to work on various aspects of your site’s design. Click this field, or press Cmd+k on Mac or Ctrl+k on Windows. For more details about Command Palete, refer [Editor Command Palette](https://wordpress.org/documentation/article/site-editor-command-palette/).

<figure><img src="https://wordpress.org/documentation/files/2019/03/block-editor-toolbar-5-6.8.png" alt="Command palette on post for duplication, add, group or delete." height="538" width="800"><figcaption></figcaption></figure>

**7. Save draft / Saved**

Save a draft of your post or page without publishing it. If the post or page is saved successfully, the label changes to **Saved**. Once the post or page is published, this label is hidden.

**8. View**

View how your post/page looks on your site with the current changes applied. For more details, refer [How to use the View feature](https://wordpress.org/documentation/article/how-to-use-the-preview-function/).

**9. Settings**

Show or hide the [post/page sidebar settings](https://wordpress.org/documentation/article/settings-sidebar/) and the [block settings](https://wordpress.org/documentation/article/working-with-blocks/#block-settings).

<figure><img src="https://wordpress.org/documentation/files/2019/03/block-editor-toolbar-6-6.8-385x1024.png" alt="Page or block settings." height="1024" width="385"><figcaption></figcaption></figure>

**10. Publish**

Make your post/page available publicly.

**11. Options**

Open up [more options](https://wordpress.org/documentation/article/wordpress-block-editor/#more-options). See below section.

**12. View Post / View Page**

After you publish your post or page, you will see this option. Opens a new tab where you can see how your post/page looks on the frontend.

#### More options <a href="#more-options" id="more-options"></a>

<figure><img src="https://wordpress.org/documentation/files/2019/03/wordpress-block-editor-sidebar-6.7-430x1024.jpg" alt="The three dot shows the menu items listed under more options." height="1024" width="430"><figcaption></figcaption></figure>

If you click the three dots icon in the top toolbar, additional options are displayed. Here, you can customize your editing experience using various options.

**View**

* **Top toolbar:** Display or hide the top toolbar in the editor. When you enable this option, block toolbars are pinned to the top of the WordPress block editor (right under the top toolbar) instead of appearing directly above the block.
* **Distraction free**: When enabled, this option allows you to focus just on your words by adjusting various pieces of the interface, including closing any open sidebars, removing various block inserter options, and the block toolbar. [Read more here](https://wordpress.org/documentation/article/distraction-free-mode/).
* **Spotlight mode**: With spotlight mode, all blocks are greyed out except for the one you’re working on so that you can focus on a single block at a time.
* **Fullscreen mode**: When enabled, this mode hides the Administration screens user interface.

**Editor**

By default, you will be in the Visual editor. Switch to the Code editor to view the entire post or page in the HTML code editor.

**Tools**

Here, you can [manage patterns](https://wordpress.org/documentation/article/block-pattern/), learn [keyboard shortcuts](https://wordpress.org/documentation/article/block-editor-keyboard-shortcuts/), visit the WordPress block editor welcome guide, copy all content on the post/page, or view additional support articles.

**Preferences**

Use the [Preferences](https://wordpress.org/documentation/article/preferences-overview/) menu to:

* Customize the editing experience.
* Change how you interact with blocks and which blocks appear when searching for a block.
* Show or hide individual panels from the [post/page settings](https://wordpress.org/documentation/article/settings-sidebar/)[.](https://wordpress.com/support/wordpress-editor/learn-the-interface/#settings)

### How to work in the WordPress block editor <a href="#how-to-work-in-the-wordpress-block-editor" id="how-to-work-in-the-wordpress-block-editor"></a>

{% embed url="<https://wordpress.org/documentation/files/2022/10/Screen-Recording-2022-10-24-at-5.00.54-PM.mp4>" %}

You can select multiple blocks by holding `shift+click` as show in the video below:

{% embed url="<https://wordpress.org/documentation/files/2023/11/select-multiple-blocks.mp4>" %}

You can select all blocks by pressing `Cmd+A` or `Control+A` as shown in the video below

{% embed url="<https://wordpress.org/documentation/files/2023/11/selecting-all-blocks.mp4>" %}

When you select some text and press the back tick (`` ` ``), it will turn the selected text inline code as show in the video below:

{% embed url="<https://wordpress.org/documentation/files/2022/10/179496420-adcc09e7-40fc-4f49-b7c1-86d3de61cc1a.mp4>" %}

Uploading media from openverse category also uploads the item in media library.

{% embed url="<https://wordpress.org/documentation/files/2023/11/uploading-media-from-openverse.mp4>" %}
