Stacks4Stacks' new (free) VimStack makes it simple to quickly and safely embed a Vimeo™ video within a RapidWeaver webpage. The VimStack is responsive and will resize to fit any screen size. In addition to the standard video options, VimStack lets you hide the video in print / PDF or embed it directly into a theme ExtraContent container, without needing any additional stacks.
The VimStack displays the default Vimeo™ player controls, however, the colour of the buttons is editable.
Video Controls – Colour
Autoplay – Disabled by default
Embed in Extra Content – Disabled by default
Extra Content No.
Hide in Print/PDF
Intro Title – Dispay video title before playback begins
TubeWeaver is now at version 3. If you have version 2, you'll definitely want to update.
Version 2 from 2015 had no customisation options, version 3 changes that.
There's not a lot to explain about embedding a video on your RW stacks page.
Drag in TubeWeaver, insert the YouTube ID and that's it. There are, however, one or two settings that you might want to change.
First off, you'll want to set the YouTube Video ID. This is the code that appears at the end of the URL.
Player Colour – The new API allows you to choose between a Red, or a White progress bar.
Autoplay – is set to No by default.
Loop – is set to No by default.
Controls? – Is set to Display by default, but the controls may be hidden for a cleaner display.
Fullscreen? – When Deny is set, the video will not display any wider than the container that it is within.
Start At (s) – Set the starting point of the video, i.e. skip an intro sequence; get straight to the nitty-gritty.
TubeWeaver is quickly and simply set up. No bells and no whistles, but I personally find the Deny Fullscreen setting to be a useful feature.
Guest Post from Will Woodgate
'Velvet' refers to the velvety smooth transition that Velvet Video displays when transitioning from thumbnail to full screen view. It is really smooth.
There are two Velvet stacks – the Velvet Base stack that enables Velvet's functionality and Velvet Video – the thumbnail/video container. Once you have placed a Velvet Base stack on your RapidWeaver page, you can add as many Velvet Video stacks to the page as you please.
Velvet Video's flexibility is quite distinguished. You can place multiple thumbnails in a multi-column stack, or in a Foundation grid, or you can drop the Velvet Video stack into a slideshow of your choice. The stack is Mobile First, so when a thumbnail is clicked on a mobile device, the video will play 'in place' whilst on a desktop or tablet display it will smoothly open a full screen lightbox.
As you already know, I am not a fan of online videos, but I do have clients that require video implementation on their sites. Velvet Video is an ideal solution if you have multiple clips to present.
First you'll need to add a Velvet Base stack to your page and configure it.
Because Velvet Video is Mobile First, the first setting is Direct Play Break – the breakpoint at which the video will play in place and not open a lightbox. The next setting is Player Shadow. The default is set to 4px, but as the default Zoom Overlay – the lightbox background – is set to dark grey, the shadow won't be immediately discernible. However, the Opacity and the colour of the Zoom Overlay may be set individually, after which the subtle shadow comes into its own light.
The final Velvet Base Settings are optional Autoplay and Full Screen Zoom and Force Loading. The latter will force load the videos so that they may be previewed at responsive sizes.
The Velvet Video stack itself has two or three more settings. First, you should add a thumbnail image for your video. Next, you need to add either the YouTube, or the Vimeo ID.
Prevent Video Zoom doesn't yet have a text tip and I was unable to see a change between active and inactive states.
Play Icon Style offers a choice of six different icon overlays for the thumbnails. I like the fact that the Play Icon Position has a multitude of options and that the Play Icon Offset can be set between 0 and 30px. The Play Icon Size may be set between 0 and 30px too and the Play Icon Colour has options for both static and hovered states.
Also quite unique are the Thumb Overlay [colour] settings which may also be set individually for both static and hovered states.
Links to the developers ® All trademarks cited on this page are the property of their respective owners.
Do you have a question regarding RapidWeaver?
Would you like help with your new project?
Would you like us to build your new RapidWeaver website?
Don’t miss a post!
Sign up for our monthly newsletter.
A monthly digest of all the latest updates from our RapidWeaver blog, keeping you up to date with the hottest new stacks and themes.
265 Moo 2
Mae Na Toeng Nai, Pai
Mae Hong Son
We design websites and print-products for small businesses at reasonable prices. We specialise in Responsive Web Design.
We do not harvest or sell personal information.
© rjh web design 2010—16