---
title: "How to Add Gutenberg Block Functionality to WordPress Widget Areas"
description: "If you’re a fan of Gutenberg and its block-based system, you’ll be happy to know the separate Gutenberg plugin can now add block functionality to the WordPress Widget area.  Though a version..."
url: https://www.inmotionhosting.com/support/edu/wordpress/gutenberg/add-gutenberg-block-functionality-wordpress-widget/
date: 2020-09-09
modified: 2026-03-11
author: "InMotion Hosting Contributor"
categories: ["Gutenberg"]
type: post
lang: en
---

# How to Add Gutenberg Block Functionality to WordPress Widget Areas

![Gutenberg blocks for widgets](https://www.inmotionhosting.com/support/wp-content/uploads/2020/09/WidgetBlocks-1024x538.png)

If you’re a fan of [Gutenberg ](https://www.inmotionhosting.com/support/edu/wordpress/gutenberg/what-is-gutenberg/)and its block-based system, you’ll be happy to know the separate Gutenberg plugin can now add block functionality to the WordPress Widget area. 

Though a version of Gutenberg is rolled into the core of WordPress, the [separate Gutenberg plugin](https://www.inmotionhosting.com/support/edu/wordpress/gutenberg/install-gutenberg-plugin/) introduces newer features that add to the experience of the software.  

Adding Gutenberg blocks to the WordPress widget areas is simple with the installation of the plugin. Once activated, you will be able to easily manage your widgets and widget areas from the admin dashboard or customizer using the intuitive Gutenberg system. 

In addition to gaining block functionality within the widget areas, the plugin also gives you access to the blocks available in the Gutenberg block library. This allows you to easily add post and page block elements to a sidebar or widget if desired.

Continue reading to learn how to make your widget management even easier with the Gutenberg plugin. 

- [Adding Gutenberg Blocks to WordPress Widget Areas](#Adding-Gutenberg-Blocks)
- [Using Widget Blocks in the Customizer](#Widget-Blocks-in-the-Customizer)

## **Adding Gutenberg Blocks to WordPress Widget Areas**

To add the Gutenberg block functionality to your WordPress widget area, follow the instructions below:

Of note, this [feature is still being developed as of 9.9.20](https://make.wordpress.org/core/2020/09/03/whats-new-in-gutenberg-2-september/). Though perfect for users who use default widgets, some many find that their 3rd party widgets are no longer available. We recommend [backing up your site](https://www.inmotionhosting.com/support/edu/wordpress/wordpress-backups/) before activating the plugin to protect against any possible negative outcomes.

1. [Log into your WordPress dashboard](https://www.inmotionhosting.com/support/edu/wordpress/logging-into-wordpress-dashboard/).
2. [Install and activate Gutenberg](https://www.inmotionhosting.com/support/edu/wordpress/gutenberg/install-gutenberg-plugin/).
3. Navigate to** Appearance > Widgets**.
4. Add, edit, and delete the widget blocks as you would on a page or post. 
5. Click **Update **to save your changes.

![Editing widget blocks in dashboard](https://www.inmotionhosting.com/support/wp-content/uploads/2020/09/WidgetBlocks1-1024x562.png)

![Adding widget blocks in the dashboard](https://www.inmotionhosting.com/support/wp-content/uploads/2020/09/WidgetBlocks2-1024x560.png)

## **Using Widget Blocks in the Customizer **

You can also manage your widgets via the [customizer](https://www.inmotionhosting.com/support/edu/wordpress/theme-customizer/). This is a great option if you want to see how your widget changes look while you’re editing. To manage widgets while in the customizer, follow the instructions below:

1. Navigate to **Appearance > Customizer**.
2. On the left menu, click **Widget Blocks**.
3. To add a widget, scroll down and click on the **+ button**, then find and click on the block you want to add from the block library.
4. To edit a widget or widget area, simply click on it and configure the options presented.
5. Click **Publish** to save your changes. 

![Example of widget block area in customizer](https://www.inmotionhosting.com/support/wp-content/uploads/2020/09/CustomWidget1-1024x697.png)

![Adding widget block in the customizer](https://www.inmotionhosting.com/support/wp-content/uploads/2020/09/customwidget2-1024x726.png)

Learn more about the new WordPress editor, Gutenberg, and the capabilities of the separate Gutenberg plugin with our helpful [Gutenberg tutorials](https://www.inmotionhosting.com/support/edu/wordpress/gutenberg/).