0:00 a video feed in a wall hey everybody Joe
0:11 workmen here and today I'm really
0:13 excited to show you the new video wall
0:16 stack now for years we've had a Vimeo
0:20 wall stack right and I've been requested
0:23 so many times Joe wins YouTube's wall
0:25 coming out well what we've done here is
0:29 that we've built a video wall where you
0:32 can have Vimeo and YouTube all in the
0:35 same wall and we have more services
0:37 planned out for the future right but
0:39 right now you can install Vimeo and
0:41 YouTube feeds directly even intermixed
0:45 in the same exact wall right so really
0:48 cool there's some really great unique
0:51 features in this new stack and I can't
0:53 wait to show you let's jump on in so
0:57 here we are on the video wall preview
0:59 site and what you'll notice we scroll
1:01 down here is the first instance of video
1:04 wall now there are two different ways to
1:06 view videos inside video wall the first
1:10 way is through a static player and as
1:14 you see here I have a placeholder image
1:16 here inside of a player and below that I
1:19 have a grid of videos now if I were to
1:23 click on this video you'll notice that
1:25 it actually plays directly inside the
1:27 static player now what's really great
1:31 about this static player is that if you
1:34 scroll down the page you'll notice that
1:37 the static player will stick to the side
1:40 of the browser window and continue to
1:42 play as the user looks at the rest of
1:45 your web page this is a really great
1:47 feature now if I scroll back up and once
1:51 the static player becomes back into view
1:53 that video continues to play seamlessly
1:56 back in the static player position it's
1:59 very cool now the next way to play
2:02 videos is through the lightbox player
2:04 and this is what you would typically
2:06 think is if you were to click on one of
2:07 these videos it will open the video
2:09 inside the lightbox as you see the lot
2:12 the video animates
2:13 in you'll notice that this the actual
2:16 webpage background blurs and we have a
2:18 beautiful effect now we can have the
2:20 title in the description of the video
2:22 here and this lightbox is completely
2:24 customizable so if you want the title
2:26 the description you can you can have a
2:28 white box or a box around it that is
2:30 configurable around the content or you
2:33 can have it just straight directly on
2:35 the lightbox background as I have here
2:37 now you may have also noticed as I hover
2:41 over these grid items there are many
2:43 different options for animating the play
2:45 button here it's very simple it just
2:48 kind of makes that play button more
2:51 opaque okay and if we look to the first
2:54 example we'll see that we have a much
2:55 fancier animation here where not only is
2:58 the play button expanding to the screen
3:00 but you'll notice the thumbnail in the
3:01 image is kind of rotating and zooming in
3:04 a little bit it's a really great
3:05 animation now another way to view videos
3:09 if you didn't want a full-blown grid is
3:12 that you can also have the videos inside
3:15 of a slider so the videos are still
3:17 organized in columns however it's all
3:20 aligned in a single row and you can
3:22 simply slide through the videos and when
3:25 you decide you want to watch a video
3:26 click on it and the videos will also
3:29 play in the static player or the
3:31 lightbox it's completely up to you now
3:34 let's quickly jump into rap Reavers so
3:36 you can see kind of how these videos can
3:38 be configured so here we are inside the
3:40 Vimeo wall demo file that ships with the
3:43 stack and let's go ahead and see how we
3:45 built this demo site so if we scroll
3:48 down the page you'll notice that the
3:49 first stack here is the static player
3:51 now this is a completely separate stack
3:54 from video wall because you can place
3:56 that static player wherever you want on
3:59 the page now the options here really
4:02 simple you just give it a static player
4:03 ID so if you want multiple static
4:05 players on the page you can definitely
4:07 do that okay you can then control the
4:10 border the border size the color and
4:12 there's also the ability to have the
4:14 caption on hover so if you hover over
4:16 the static player while the video is
4:19 playing it will actually display the
4:21 title in the description of that video
4:24 for you now further down on the page
4:27 is where we get into video wall so if
4:29 you notice here when you add video wall
4:31 to the stack there is a plus button now
4:33 I already have a YouTube feed setup here
4:35 but you can go ahead and click plus and
4:37 you can add either a Vimeo feed or a
4:39 YouTube feed now what's great is you can
4:42 have as many feeds as you want inside of
4:45 a video wall you can have multiple
4:47 YouTube multiple Vimeo or a combination
4:50 of all of them and they'll all be merged
4:52 into the same wall and it will work
4:55 fluently now let's go ahead and look at
4:58 the YouTube feed stack first off we have
5:00 a little edit note so you can add maybe
5:02 a little note about what this particular
5:04 playlist is okay and then you can
5:07 configure your YouTube query now in
5:10 YouTube we have the ability to have
5:11 playlists channels channel video search
5:15 or search all videos okay so obviously
5:18 playlist if you select playlist this is
5:21 the playlist ID that shows up in the
5:23 YouTube URL ok next is the channel video
5:28 now um this is the channel ID now if
5:31 you're on a YouTube channel and the URL
5:33 is one of the more user-friendly URLs
5:35 such as youtube.com slash Weaver space
5:38 okay you're gonna actually have to find
5:40 out the YouTube channel ID now if you
5:43 own the channel you'll be able to find
5:45 that channel ID inside of your channel
5:47 settings okay next up is channel video
5:51 search and this allows you to search for
5:53 videos within a channel okay so you give
5:56 the channel ID again and then you give
5:57 your search query and the last option
6:00 for YouTube is to search all videos so
6:03 basically this is gonna search all
6:04 videos within YouTube now if we check
6:07 out the Vimeo feed we have a little bit
6:09 more options Vimeo has a lot more
6:11 queries that we can actually query via
6:13 the API so we can query things like
6:15 likes appearances albums channels
6:18 categories and even tags now
6:22 now that we've configured our feeds
6:24 let's go ahead and look at the video
6:25 wall settings first is gonna be how do
6:27 we want to sort our videos we can sort
6:29 by newest oldest likes shuffle the
6:32 videos or just have none basically it's
6:35 going to just return the sort order that
6:38 is brought to us by the various services
6:40 okay now a quick note about likes likes
6:44 currently is not supported by YouTube we
6:47 hope to add that in the future next up
6:50 is how do we want to display our player
6:53 and our wall so do we want the grid or
6:56 do we want a slider do we want the
6:58 player to be a light box or a static
7:00 player okay
7:01 so they're just simple little toggles to
7:03 determine what you want to do there then
7:05 the settings are breaking down pretty
7:07 much by each component so here we have
7:09 the video grid so do we want to show the
7:11 title under the video that customize the
7:14 borders and the shadows and the loader
7:15 color okay we can customize the number
7:18 of columns on small medium large and
7:21 extra large
7:22 now if you want granular control you can
7:24 click this plus button and you can
7:26 actually configure the break points that
7:29 are used for all of these settings next
7:32 up further down we can configure the
7:33 gutter border and titles and similarly
7:35 if we click on the plus button we can
7:37 configure those values on a per
7:39 breakpoint basis next up is the play
7:44 button there's a lot of variations that
7:46 we can have here do you want a circle a
7:48 square or no play button okay do you
7:50 want to animate the button and the
7:52 thumbnail or either/or so you can turn
7:54 off the animations for those and then
7:56 here you can configure the color and the
7:57 sizing next we have colors and sizing
8:02 for the slider navigation and then the
8:05 lightbox so you know do you want to show
8:07 the title and description some
8:09 configurations on how you want things to
8:12 animate
8:12 okay so modal animation is the lightbox
8:15 self the page animation is the actual
8:18 web page behind the lightbox there's
8:20 some actual interesting animations for
8:22 those as well and then of course all the
8:24 all the colors and sizing availability
8:27 and if you're using the static player
8:29 this we configure the player ID so that
8:32 this needs to match the ID that is
8:34 inside the static wall so I zoom through
8:38 that pretty quick okay but you see it's
8:42 pretty simple to set up
8:43 just follow kind of the logical order of
8:46 the settings it's pretty simple however
8:49 things are pretty complex in terms on
8:51 the back end right the stack does some
8:53 really amazing things for us so simply
8:57 right like integrating multiple feeds
9:00 into a single wall right and hopefully
9:03 in the future we plan on adding even
9:05 more video services so I'm really
9:08 excited for where this video wall is
9:10 taking us it really allows us to
9:13 dynamically add videos to our websites
9:16 right no longer do you need to add
9:18 videos inside your rapid Eva project if
9:21 you want to add a new video to your
9:22 website just simply create a playlist in
9:25 YouTube and start adding videos to it
9:27 you had a video into YouTube within
9:30 minutes it's gonna show up on your
9:32 website automatically you don't need to
9:34 do anything special right video wall
9:37 takes care of everything for us it is
9:39 100% automated and I might add that it
9:43 also a hundred percent works inside
9:45 rapidweaver
9:46 and this is really cool because if you
9:48 use some of the older versions of Vimeo
9:49 wall it didn't really work in rap you
9:52 had to actually publish to make sure
9:53 that everything was working but now
9:55 everything works beautifully directly
9:57 inside rapidweaver
9:58 so I hope you enjoy video wall I can't
10:01 wait to see the amazing things that you
10:03 build with it and please make sure that
10:05 you share your websites on Weaver space
10:07 so we can see them and other users can
10:10 get inspiration from them so thank you
10:13 again I hope you enjoy Vimeo wall and
10:15 we'll see you next time bye
10:19 [Music]
10:24 you
10:24 [Music]"}]