Title: Block-based Widgets Editor
Author: annezazu
Published: July 8, 2021
Last modified: July 27, 2023

---

# Block-based Widgets Editor

## In this article

 * [How to use blocks in the Widget editor](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#how-to-use-blocks-in-the-widget-editor)
 * [How to use blocks in the Customizer](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#how-to-use-blocks-in-the-customizer)
 * [How to manage Legacy Widgets](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#how-to-manage-legacy-widgets)
 * [How to opt-out](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#how-to-opt-out)
 * [Demonstration of the Block-based Widgets Editor](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#demonstration-of-the-block-based-widgets-editor)
 * [Resources](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#resources)
 * [Changelog](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#changelog)

[ Back to top](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#wp--skip-link--target)

The Block-based Widgets Editor brings the power of blocks to the **Theme Customizer**
and **Appearance** > **Widgets** sections in the WordPress Administration Screens
allowing you to add blocks right next to any current widgets. You can now customize
your Widget Areas using blocks, just like how you use the [block editor](https://wordpress.org/documentation/article/wordpress-editor/)
to create content.

The Block-based Widgets Editor was introduced in 5.8 for those who use classic themes
with [widgets](https://wordpress.org/documentation/article/wordpress-widgets/). 
With WordPress 5.8 or higher and a classic theme like [Twenty Twenty](https://wordpress.org/documentation/article/twenty-twenty/),
you can see the Block-based Widgets Editor.

![Block-based Widgets Editor](https://wordpress.org/documentation/files/2021/07/
test-widgets_v2-1-1024x643.jpeg)

Appearance > Widgets View

![Widget area in the Customizer](https://wordpress.org/documentation/files/2021/
07/test-widgets-customizer-1-1024x643.jpeg)

Customizer View

## 󠀁[How to use blocks in the Widget editor](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#how-to-use-blocks-in-the-widget-editor)󠁿

The interface replicates the [Post Editor](https://wordpress.org/documentation/article/wordpress-editor/)
experience, allowing you to use similar workflows like drag and drop. The biggest
difference is that you will see distinct editing areas that represent the various
Widget Areas as part of your theme, like Footer and Sidebar.

Within each of these areas, you can add blocks like you would in the Post Editor.
You can edit any previous Widgets you’ve added using the **Legacy Widgets** block.
Of note, [Theme blocks](https://wordpress.org/documentation/article/blocks/#theme-blocks)(
Site Logo, Site Title, etc) and [Synced patterns](https://wordpress.org/documentation/article/reusable-blocks/)
have been disabled in this editor.

**How to add a block**

 1. Navigate to **Appearance** > **Widgets**.
 2. Click on a specific Widget Area you’d like to edit.
 3. Select the **+** prompt to add a block. You can use the search functionality to
    find the block you want or select **Browse All** to see the various options.

**How to move items between areas**

There are two ways to move items between areas:

 1. You can use drag and drop by hovering over the block toolbar, selecting and holding
    it, and dragging it to a new section.
 2. You can use the option shown below in the block toolbar to move to the desired 
    Widget Area:

![Block widget mover](https://wordpress.org/documentation/files/2021/07/Screen-Shot-
2021-07-06-at-8.36.47-PM-1-edited.png)

## 󠀁[How to use blocks in the Customizer](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#how-to-use-blocks-in-the-customizer)󠁿

If you’re more comfortable managing your Widget Areas in the Customizer, you can
now add widgets and blocks with the same ability to live preview, schedule changes,
and publish that you’re used to. The main thing to keep in mind is that, due to 
the small size of the Customizer, some settings require a few more steps to find.
To find all block settings, follow the steps below:

 1. Use the **+** to add a new block.
 2. After adding the block, select the three-dot ellipsis menu and choose the top option
    of **Show more settings**.
 3. From there, you’ll see more options to customize your block to your liking.

## 󠀁[How to manage Legacy Widgets](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#how-to-manage-legacy-widgets)󠁿

For any widget that doesn’t come with WordPress and that hasn’t been converted to
a block, you can use the Legacy Widget block to manage any existing widgets or third-
party widgets.

## 󠀁[How to opt-out](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#how-to-opt-out)󠁿

A user may install and activate [the Classic Widgets plugin](https://wordpress.org/plugins/classic-widgets/)
to opt-out of this feature. This will return you to the [original view](https://wordpress.org/documentation/article/appearance-widgets-screen/)
of the **Appearance** > **Widgets** and the **Customizer**.

## 󠀁[Demonstration of the Block-based Widgets Editor](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#demonstration-of-the-block-based-widgets-editor)󠁿

Demonstration of the block-based Widgets Editor and blocks in Customizer experience

## 󠀁[Resources](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#resources)󠁿

 * [Block-based Widgets Editor in WordPress 5.8](https://make.wordpress.org/core/2021/06/29/block-based-widgets-editor-in-wordpress-5-8/)

## 󠀁[Changelog](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#changelog)󠁿

 * Updated 2022-12-06
    - Added ALT tags for the images
    - Added internal links to other support articles.
    - Updated videos.
 * Created 2021-07-08

## Was this article helpful? How could it be improved? 󠀁[Cancel reply](https://wordpress.org/documentation/article/block-based-widgets-editor/?output_format=md#respond)󠁿

[Log in to submit feedback](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fdocumentation%2Farticle%2Fblock-based-widgets-editor%2F&locale=en_US).
If you need support with something that wasn't covered by this article, please post
your question in the [support forums](https://wordpress.org/support/forums/).

First published

July 8, 2021

Last updated

July 27, 2023