Gutenberg blocks

Getwid Blocks: Video Popup Gutenberg Block

Home > Blog > Getwid Gutenberg Blocks > Getwid Blocks: Video Popup Gutenberg Block

The Getwid plugin lets you create a video popup Gutenberg block in WordPress sourced from self-hosted videos (uploaded directly to your WordPress Media Library) or external video hostings, such as Youtube and Vimeo. Website visitors will be able to open videos in default or full-screen mode.

The block ships with tons of extra settings that will allow you to create a custom look for video thumbnails, add and modify image covers, place a play video button and do more manipulations in order to create attractive popup videos.

Purpose of the Video Popup Gutenberg Block

video popup video frontend

There is almost no business or project that wouldn’t benefit from a video. Feel free to use this block for different purposes:

  • Product videos.
  • Frontpage hero/introduction videos.
  • WordPress video galleries, etc.

You may also want to take a look at the next Getwid solutions:

Features of the Video Popup Gutenberg Block

Let’s walk you through some settings and styling options:

  • First up, add a video URL. If you want to play self-hosted videos in a popup, go to Media > Library > Add new > upload your video file > select video > click “Copy link” and insert it in the appropriate field in the Getwid block.

video url

  • Customize the play video button: select a button style, turn on the Pulse animation effect, select size or manually input the width of the button.

video popup settings

  • Optionally add a caption next to the play video button.

gutenberg block caption

  • Upload and edit a video cover – you can change the size of the image, set specific image height, and optionally apply animation effects and image overlay colors.

gutenberg block video popup video cover image

Please note: Go to the Preview mode in Gutenberg to test how the video player works on the frontend (it doesn’t function on the backend).

Design Tips

  • If you use video cover images and add captions next to the play video button, you can apply image overlay to make the text more readable.
  • Self-hosted videos, especially if the file size is big, can take up a lot of space on your hosting, thus, slow down your website. If you stick to external services like Youtube, you do your website performance a favor. However, if you want to avoid playing videos with branding from third-party video services, self-hosted videos are a way to go.

Download Getwid Base Gutenberg Theme

For the utmost design and functionality compatibility with Getwid Blocks, we recommend that you give a try Getwid Base – a free WordPress theme for all types of business projects and professional portfolios.

Learn more:

Check out Getwid WordPress Blocks Demo

Download Getwid Gutenberg Blocks Free

Install Getwid Base Starter Theme for Gutenberg

Getwid Video Tutorials

Was this article helpful?

Yes No

You have already left your review.

Leave a Reply

Your email address will not be published. Required fields are marked *