All Collections
Publish Content
Videos
Change the width of Block Editor elements
Change the width of Block Editor elements

Some blocks don't let you easily change their size, but you can leverage the Group block for greater control

Stephy Miehle avatar
Written by Stephy Miehle
Updated over a week ago

By default, many blocks (such as Video or Embed) take up the full width of the editor. A few (such as Image) have extra controls for sizing. For the ones that don't, you can add a Group block around them to limit their width.

Embedded video block taking up the full width of the editor

Adding a Group Block

Add a new Group block to your page. Once it's added, you'll see a large, wide rectangle with a plus sign inside.

Add content inside the Group block

Add your video, embed, or other content you'd like to have a limited width. In this example, we're adding an Embed block with a video, but you can add headings, buttons, text, and more.

When we click the Embed button or click outside of this block, we see a full-width preview of the embedded content that looks exactly as it did before we added the Group. Even though we can't see it yet, the Group is still there!

The Group block is harder to see since it acts as a special wrapper around other blocks, but you can use your keyboard to navigate. Click on your video block, then tap the up arrow on your keyboard. You'll know you've done everything correctly when you see the Block properties sidebar refer to the Group instead of your blocks inside of it.

Screenshot of the block selection with the Group block circled

Now, you can set a width for your content. Look in the Layout section, then type a pixel value inside the Content textbox.

Here in our example, the width is set to 600px and there are no longer black bars around the embedded video!

Now that the Embed block is no longer full-width, we can also click in the empty space on either side of it to select the Group block and make any edits:

Screenshot of the editor with the content limited to 600 pixels wide

For any questions regarding the block feature, contact support@gouconnect.com!

Did this answer your question?