How to Use Great Videos on Your Website using Stackable Blocks

How to Use Great Videos on Your Website using Stackable Blocks

Last Updated on June 27, 2022

Some say videos might be the next king of content. Whether you agree with this prediction, there’s no denying that videos are a great media form. Learn how to easily incorporate videos using Stackable.


Videos are quickly becoming the wave of the future. This great media type can put your website to an elevated level – with videos, your visitors will surely be captured and captivated more easily. Given their importance, Stackable lets you incorporate videos in different ways throughout your website, and it’s very easy peasy.

1. Videos as Substantial Content

Videos are usually incorporated as substantial or main content. As the videos obviously have special visual impact, it is gaining preference from content creators and consumers alike. Some even say video might be the next king of content.

As far as content goes, videos can be quite heavy though and has the tendency to affect the loading speed of your website. To solve this, you can use the Video Pop-up block, which offers a handy way to feature great video content while keeping your site on the lighter side.

Stackable Video Pop-up Block

The Video Pop-up block lets you incorporate YouTube and Vimeo videos without embedding and allows you to showcase either a still or a different cover photo for the video.

The Video Pop-up block also allows for different design configurations so the block can be designed in such a way that it will blend really well with your overall website design. Here are some of the settings that you can tweak:

  • Block width
  • Block border radius
  • Shadow outline
  • Play button style and color
  • Display/background image
  • Display/background color tint (single or gradient)
  • Hover effects

If you want even more control, you can also implement more complex changes easily with the Stackable custom CSS panel. The Video Pop-up block will also soon get a ton of more fine-tuned settings and options when Stackable version 2 is officially released.

2. Videos as Design Elements

Needless to say, the norms of web design has become more complex and interesting over the years. These days, using video has become a given part of web design, and using video in creative ways (as dynamic design elements for backgrounds or as interesting accent pieces as opposed to substantive content) has a become great option to level up your website design.

Given the advances in page building technology, incorporating videos has not only become possible, it’s become easy to implement.

Video Backgrounds using Stackable Blocks

Using your videos as design elements is quite easy using Stackable. For all Stackable blocks with background options, you can easily incorporate videos as background media.

Celebrate with Video

Use video as a great background for a stunning design option

Currently, the following Stackable blocks have the option of using video as a background:

For these Stackable blocks, the background settings can also be tweaked to ensure that they complement your overall website design.

When using this option you need to ensure that the video will not affect the loading time of your website. To help you with this, we recommend trying using videos as follows:

  • MP4 format
  • Max 10 seconds run time
  • 480p or 720p video resolution
  • Max 1 MB file size

If you find this option to be useful in designing your site, the great news is we’re adding this solid feature in most blocks in Stackable version 2.

Recap

Since videos are becoming a solid part of most websites, Stackable gives you great options for incorporating videos in your design. With Stackable, you can make use of this dynamic media form by using the Video Pop-up Block for substantial content or as a great background option for the Container, Header, Call-to-action and Video Pop-up blocks.

Whatever option you will choose, you can be assured of great video design possibilities without considerably affecting the loading speed of your site.

Want to learn more
about Stackable?

Your very own Learning Hub for all things WordPress and Stackable. Find the right resources to help get you started as you begin building your online presence with Stackable.

Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.