We love the default block builder better known as Gutenberg. In fact, we based Presto Player entirely on it.
Thus, Presto Player works perfectly with Gutenberg and provides six different blocks. Three blocks are available with the free Presto Player:
- Presto Vimeo Video – a block for adding videos hosted on Vimeo;
- Presto YouTube Video – a block for adding videos hosted on YouTube;
- Presto Video – a block for adding self-hosted videos (videos hosted on your server);
In addition, with Presto Player Pro you can use three additional blocs:
- Presto Bunny.net Video – a block for adding videos hosted on Bunny.net;
- Presto Bunny.net Private Video – a block for adding videos hosted on Bunny.net visible only to logged in users;
- Presto Private Video – a block for adding self-hosted videos visible only to logged in users;
There are two methods for using Presto Player with Gutenberg. You can do it by adding videos to individual posts or pages or using the media hub:
Method One – Add Videos Individually
You can add videos to your individual Gutenberg-built post or page, by following these steps:
Step 1 – Start editing your post or page with Gutenberg. Here, click to add a Presto Player Video block. You can choose any of the available Presto Player Video blocks. To illustrate, we will use the “Presto YouTube Video” block;
Step 2 – Click on the block, add the URL of your YouTube video, and click on “Add Video“;
Step 3 – Once the video is loaded, you can adjust the block settings. Accordingly, you can add Chapters, Autoplay, and other video settings, use presets, add Branding, etc. Click “Publish” to save your video.
Presto! You added a video to your post or page.
Method Two – Media Hub
If you need to add your videos to multiple places on your website, you can use Media Hub. This way, if you want to make any changes to the video, you can do it from one place.
Modify a video in Media Hub, and changes will be applied to all places where you added that video.
Add Video To Media Hub
Follow these steps to add a video to Media Hub:
Step 1 – Navigate to Dashboard > Presto Player > Media Hub. Here, click on the “Add New” button, and give your video a name;
Step 2 – Next, select the video type based on where you want to store your video. Thus, you can choose from four different options: (self-hosted) Video, YouTube, Vimeo. If you have Prest Player Pro activated on your website, you will also see the Bunny.net option;
Step 3 – As with the previous method, as an example, we’ll add a YouTube video. Hence, we’ll click on the “YouTube” option, add our video URL, and click on “Add Video“;
Step 4 – Once the video is loaded, you can adjust the block settings the same way as with method one. Click “Publish” to save your video;
Add Media Hub Video To Page or Post
Now, the video is live, and it’s time to add it to your page or post using Gutenberg:
Step 5 – Start editing your page or post with Gutenberg. Next, in the top-right corner, click on the “Presto Player” icon. Here, you’ll see the list of all videos in your Media Hub;
Step 6 – Find the video you want (browse or use the search tool), and just click on it. This will add that video to a page or post;
Step 7 – When you click on the block, you will only see the “Manage Media Hub” option. Thus, any changes you want to make for this video can be done in Media Hub.
You successfully added a video using Presto Player with Gutenberg.