Table of contents
Adding a video in Gutenberg
Tutorial Video on How to Add YouTube and Vimeo Videos in WordPress
Step 1
There are two types of videos you can add in Gutenberg: uploaded video file and embedded video.
Step 2
To add a video as a file upload, hover your mouse over the Add Block icon (the plus sign in the upper left hand corner within the Gutenberg editor).
Step 3
Select Blocks. Then scroll to Common Blocks. Under that section you will see Video. Select Video.
Hint: You can also type “Video” in the search bar to quickly get to the video option.
Step 4
A video block will appear within the editor. Click on Upload to upload a video from your computer. Click on Media Library to select a video that you’ve previously uploaded from your media library. Once you’ve uploaded your video or selected it from your media library, click on use url. A preview of your video will appear in the editor. Note: You will not be able to preview your video within Gutenberg editor, but you can preview it, by clicking Preview button in the upper right hand corner.
Step 5
To upload a video as an embedded video, there are a multiple embed blocks you can use such as: Embed block, Youtube embed block, and Facebook embed block. Hover your mouse over the Add Block icon (the plus sign in the upper left hand corner within the Gutenberg editor). Click on add block Click on Embeds and select the method of embedding you would like to use (YouTube is used for this example).
Step 6
Paste the url of the video you would like to use within the embed block. After you entered the link, click Embed.
Note: You will not be able to preview your video within Gutenberg editor, but you can preview it, by clicking Preview button in the upper right hand corner.
Final Result
Now you will see your YouTube or Vimeo video in the WordPress editor. You can now preview or publish your page in order for your visitors to view it.
Leave a comment