About Stacks Guru

Stacks Guru is born from the need to search the vast number of videos out there on stacks built for Stacks Pro and the Stacks 5 plugin for Rapidweaver.

We have scraped over 500 videos to get the transcripts for each in order to make the spoken word searchable.

Please use this free tool to help you learn and discover the awesome power that Stacks and the stacks made for Stacks have to offer.

Stacks Guru

Video Reference

Leave a Tip!

Every little bit helps to keep this going. I'll be doing my very best to keep up with the likes of Joe when it comes all the videos he posts!

New Video Pro Stack - The Ultimate Video Player featuring CTAs thumbnail

New Video Pro Stack - The Ultimate Video Player featuring CTAs

I have been working on a new video stack secretly, and I'm thrilled to show it to you today. What makes this different from the other 10 or so video stacks? If you want a serious video player, you will want to check out Video Pro. While there are many unique features to this stack, the top feature is no doubt it's ability to launch CTA directly in the video player.

Categories: Live

Transcript

excellent okay sorry about that guys I think we're live
now let's see in the chat we got people in the chat oh we got a few people there okay starting to come
in had some technical glitches this morning sorry about
that just a couple uh thumbs up in the chat if you can let me
know he Mr pow here literally have your popcorn in your hands nice Bruno thanks for popping on
Bruno I owe you a response I think it's you um about Stacks Pro sorry I've been
insanely busy because of what I'm show about to show off right now um so I've dropped the ball on helping some people
out but I will make sure I get back to you this afternoon Gunter Fernando thanks for
popping on sweet okay yeah we haven't um yeah I
think I missed two weeks in a row sorry about that um you may see me I I have a little stool back here um if you
remember I injured my foot a couple weeks ago it's still I still got like one of those boots on so um but I I like
to stand during live streams um but I I may need to uh sit on the stool for a little bit um so
okay so man I've been working working hard lately um so you know last week I did
get beta 1 of total CMS out um for those of you were able to join that hangout um
I did post post it uh for everybody on the total CS 3 beta space um so if you
just want to peruse it it is 3 hours long though so just a warning on that um
but even if you have the beta or not you can get a little preview um I am keeping the beta kind of tight-knit for right
now um just to people that I know are exper or people that purchased the uh
you know uh this the pre-sale at the summit so um yeah it is a limited number
of people for right now um until we get uh further down the line okay but that's enough about total CS 3 cuz uh yeah
we're here about to talk about a brand new stack called uh video Pro and
um so I've actually wanted to do this stack for a long time I started it a
while ago um but then I don't know what took priority it was a bunch of stuff
total CMS and a bunch of other stuff just took priority over this um I think I had started it last summer so close to
a year ago and um and yeah so I just uh recently looked
at like hey let me let me see if I can get a new it's been a while since I released something completely brand new so um yeah I polished it and took the
dust off of it and uh made it pretty flipping cool a lot cooler than I was expecting it to be actually and um so
let's let's go ahead and dive in really quick let's go ahead Ando okay um so
this is the video Pro um web page okay it's the product
page on Weaver space it is live you can actually go ahead and purchase it now um couple questions that I've already
gotten is what is the upgrade from since this is a version 1.0 product um
so I am offering an upgrade from people that own my HTML 5 video stack so if you
own that um this is technically like a completely different Beast okay but I uh
yeah I thought it would be good just to offer an upgrade path from that stack if you want a more professional um video
player so that's what that is okay um now let me actually let me step back
before we go into all the features I have like I think I counted 10 different
video stacks and they all do like different things right um they're all for
different purposes and some of them have fancy animations and some have background and overlay content some do
video slid shows and all kinds of stuff right now why do why do we need another
another one okay and the big selling point here um is
going to be probably the last feature we're going to show off today and that is going to be the ctas okay the call to
actions um there's some other really cool features as well we're going to dive into okay but video Pro essentially
is it is a if you need a video player if you need to play a video and have your
user sit there and watch a video not like something that's like a part of some fancy web page that you know is
kind of an like if you need a serious video player this is the product it doesn't have a lot of fancy animations
like Play now play has its place right I think play is really cool it's got some again that that hover animation with the
thumbnail and it's got some really cool features pops up in a light box right
um this isn't that this is if you want to very very serious video player that
has some serious professional features that's what this that's what this is okay so with that said um let's dive
into the some of the features now okay um onstead of looking at the
features list let's let's dive it straight into the demo okay so one thing you'll notice here is
uh we have device specific videos now okay meaning you kind of like uh if
you're familiar with the F6 picture stack the foundation 6 picture stack where you can Define different images
for different sizes of devices you can now do that for video okay I
could be wrong but I think this is the the first video stack to my knowledge it actually does that okay um so that's
really cool and just if you look at this demo um let's go ahead and preview I'm obviously on a large machine we'll see
that this video is playing okay um if I go ahead and and Shrink this down let's
go to like a a medium size okay now you can't just shrink it down you actually
have to refresh because I don't want to load videos Dynamic like multiple videos
so I do do it on page load right but now we're smaller and we'll see that a different video has now
loaded okay and let's go ahead and go all the way down to a mobile size okay
we're going to refresh again and play this and you'll see is a third video is
playing so I'm playing now normally you're you're not going to do this right you're going to load the same video just
at different resolutions I loaded three different videos so that you can visually see and
prove to you that we're loading three separate videos uh based on um the
device okay or the screen size okay so pretty basic feature uh but
yeah I think it's really cool okay another thing you will you should notice in here is um it might be a little faint
over the live stream um I probably could make these a little bit bigger but there are markers set here so you can Define
little markers within the timeline um for maybe key moments within a video
that you want to Target and there's some other things we could do with those markers uh that we'll get to in a little bit okay um so yeah the markers are an
interesting feature um obviously I mean this stack has a lot of the default features that a lot of video Stacks have
you know Auto playay volume controls um turn off various controls down here
right um speed features so you can actually not not a lot of video actually have speed so that's kind of an
interesting feature where we can you know 2X or 1.5x or whatever the videos okay um and you can turn a lot of those
off supports AirPlay um picture and picture supports that as well okay um
okay next up is so instead of just having a single video What If I wanted to actually have
an entire playlist of videos and so here if we go ahead and click on this little bad boy down here
on the control panel or on the control bar you'll see that I now have a list of videos that I can actually pick to
play so I can go ahead and pick a different video and it'll Play that video I can go here I can pick a
different video and it'll play that one right so you can just go through this playlist and and play the different videos now it's also interesting is that
um if you play if you just let the videos play it'll actually keep going it'll play the next video and then play
the next video um so like if I go ahead and if I played this uh video oh let's
go ahead and go to top one so if I go to this top video here um once this is done
it should automatically kick into the the next video and there it goes so it automatically kicked into the next video
in the playlist and obviously once it hits the very last video in the playlist it's going to stop okay so there we
go um so that's playlists um a really cool feature actually okay um now I do
want to note that um the playlist feature
um and the device specific videos feature they kind of they overlap a
little bit and that um as of right now you can't have device
specific videos and playlist okay so if you want to use a playlist cuz long
story but uh essentially they use the same kind of technology to to behave or
to to do what Their features do okay and um the playlist feature um basically
every video that you add which we'll look at in a little bit will be a member of that playlist okay we'll dive into
rap Weaver and or into into stacks and show you uh what that looks like all right now the big boy feature
okay um and there's more features that I haven't actually put on this demo that we'll we'll dive into okay but um this
is the the the last really big feature and it's called call to actions okay um
actually let me go and refresh this page all right um
so in call to
actions if we go ahead and play this video sorry I let's see for now I always wonder the difference between these
Stacks in standard foundation six and video wall Stacks this stack the stack list mushrooms
yes the stacklist mushrooms yeah um May maybe later on today if we have
some time at the end I can kind of I don't know I don't want to go over every video stack but they all have their own uni unique feature set now the one that
comes with Foundation 6 that is like the Bare Bones minimum it just is uses the
base browser player okay so I guess another uh actually before we dive into
this another feature of this player okay is is that your player will look the
same across multiple browsers if you were to use something like the the video stack that comes in
Foundation 6 or the the video stack that I have inside my free starter pack okay
they both use the the video player baked into the browser okay and what that
means is every browser's player is going to look a little bit different okay um
but if we use this um video Pro the player the controls everything is going
to look uniform no matter what browser you go to so um that's a big another big
oneup for this if you want consistency across your browser and how your video player looks and
behaves um then yeah uh you'll like this one okay because it has a consistent
interface okay and then there there again like I said earlier there's a lot of other Stacks that have you know play
has fancy animations impact does like slideshows right so they all have some
other extra Pizzazz right but um from like the base videos that are that the
stacks that you have in Foundation 6 in my starter pack to let's say compare to this one that's the big difference now
if you do have my HTML 5 video stack it does have this a similar base player
theme but it doesn't have any of the pro features that we have here it doesn't have device specific videos it doesn't
have playlist support it's not going to have ctas and a bunch of other stuff that we're going to look at right now
okay okay ctas what is a CTA it's a call to action and um there's two ways that
we can launch ctas I'm going to go and play this video okay and what we'll notice is there there's a little marker
right here and once we hit that marker you should notice that voila okay I have
hit that marker and I had a CTA attached to that marker okay and this CTA in this
case is just a little um oops oh interesting it reached the end of the
video I maybe the video didn't pause um I think I forgot to to click pause on that video but you okay um let's go
ahead and play that
again oh it does continue to play oh darn it I'm G to have to fix this demo um so I do have a setting to either
continue playing the video or to pause um I was expecting that to actually pause but apparently I was testing the
that new feature that I this morning and it does that so um but let's go ahead
and play this again so we can see the CTA now this CTA um as we'll see later
on inside Stacks you can put whatever you want in this you can position this box wherever you want you can configure
the background colors and all that type of stuff and um once we hit the end of
the video if you remember this this wasn't here before once this video ended
um this used my call to action stack so video Pro not only has its own
built-in call to actions that display within the player but you can also integrate with call to action stack um
to do all the things that it does so you can trigger light boxes this opened up peekaboo here you can integrate with all
kinds of stuff okay so um and you can trigger a call to action based on any
marker or if the video ends okay so really really cool and
we'll look at some other options on how we can Style some ideas about these ctas as
well um lastly this last demo here is an um interesting one it's just play on Hover so as I you see when I hover over
this video okay um it plays the video when I un hover it shows the
thumbnail right um You can also you don't have to show the thumbnail on un hover that's a feature um you can turn
that on and off you can just have the video pause but um yeah this is interesting um so I don't know if Ryan
Doby is here but um I definitely had him in mind when he was when I was building this because he wanted the ability to
hover over an image uh seamlessly and kind of have a a image thumbnail on top
and then unveil and hover to show like a product video okay and uh so yeah a
really quick elegant way I'm I'm also you see you see no video player here
okay you don't see the player controls you don't see the play button
and uh yeah it's uh pretty cool I I'm really happy with that right let's dive in into Stacks now
that I showed you all like the big main features there's a couple big features that I don't have demos for um but we'll
we'll dive those uh into those right now in the stacks
okay let's go ahead and let's open up video Pro uh this is the demo file um
there might be a couple pages I think I added this YouTube page this morning um so this page might not be in the project
if you already purchased this I know some people already purchased the project file um or the the stack which
includes the project file um I also have a few bug fixes that I already have implemented that haven't shipped yet um
if you saw the post on the community I the demo was completely broken this morning um and I fixed it and then I
fixed the bug and then I put that it was actually with that play on hover thing it was breaking all the things on the on the page um long story short I fixed it
that's why the demo is back on the product page and it works okay um and then there's a couple other style bugs
and whatnot where like the play button wasn't perfectly centered and on certain themes in the foundation one theme um so
fix that there are some hover color issues and um just conflicts with other Stacks or themes um the normal routine
stuff that uh that we have as I Rel Stacks right okay um but let's dive in
uh we're going to go through each of these These are um the exact demos that we just looked at on the product page
okay um so let's dive in uh what I'm going to do here is we'll dive through kind of all the settings and then we'll
we'll um go through each specific one specifically the the CT kind of show you
how and what we can do with those okay so here we have um we're going to
show off the device specific videos but let's kind of just do a general overview of the stack settings okay so at the
very top we have a poster image and um I have decided just to do a warehouse
poster image the reason being now I I know some people are like where's my drag and drop image and I'm willing
to modify this my way of thinking here but with videos you can't drag and drop
you have to put in a URL to a video right um further down here now I figured
if you're going to put a URL to a video we can easily put a URL to a
thumbnail too right so I don't know I am uh if some people adamantly hate that
and they want their drag and drop but they still want you know uh a URL for uh the videos I can do that I mean um yeah we
we can do that but um yeah just for right now I just thought uh having it a
URL we'll see how people react to that let me know in the comments or and if you pick it up let me know what you
think okay um some other related post images or poster settings um we can show
the poster after the video is ended so a lot of times with the default video player you just see the last frame of
the video or sometimes just a black box right um so this will then show that
poster um once the video is ended um you can also show the poster when the video is paused okay um so for SEO purposes we
have a title so you can you know type in your title so that the search engine Gods know what this video was about
basically okay um obviously your sizing options um
preload data so do you want to um automatically load video um if you want the fastest page performance um then
choose none or metadata um Auto will sometimes depending on the person's
connection it will actually start load downloading some of the video um so if you set it auto then potentially the
video will play faster um so it's it's a tit fortat sort of thing do you want
faster page load times or do you want um the video to load faster it's really up to you so um we we give you that option
there and obviously your start volume okay I don't recommend setting that to like one right set it a little lower or
I have it set pretty low maybe I think the default I have it set is 08 okay but you can set the default uh volume here
next up is we have just some features that most video Stacks you would anticipate right autoplay muted
plays in line actually I should have plays in line turned on by default um
what that does actually is if you watch the video on a mobile device if you have
this turned off um the video will load in full screen every time right on a mobile device so um I think I'm going to
turn this on by default um so right now it's turned off by default I think so we'll probably turn that
on you can set the video to Loop so it it'll just keep playing and playing and playing um and then the play on hover
feature um next up is we have the ability to change a bunch of controls and and how
when we see the controls okay so do we want to always hide the controls do we want to always show the controls do we
want to hide the controls when the video player loads do you want to hide the controls when it's paused right so just
various times on when we're going to see or not see the
controls um next is um some extra buttons okay so we have jump back and
jump forwards which is to skip 30 seconds backwards or forwards okay um we
have AirPlay um so if the airplay button will only display if the browser you're
viewing in supports AirPlay okay um and then we have the speed controls which you could do 1.5
1.75 2x blah blah blah okay um we have some settings for the play button you
can you can completely hide the play button and then you can also set the size of it um here's the markers as
we're just kind of diving through all these settings when you add in Timeline markers um you just Define a common
delimited list of the seconds where you want the marker to be so if you want it
at uh 1 minute in 60 seconds okay you have as many of these as you want it's just a common Del limited list of
seconds so if you're like one hour in that would be what 360 seconds right 60
* 60 okay um um you can Define the width and the color of those markers as well
here next um next is playlist support we'll dive into these settings in a
little bit okay when we look at the playlist demo right um and I just
realized that my cursor my little cursor dudad is uh not on so we'll do this so you guys can uh see my cursor a little
bit better oh thank you Fernando 3600
[Laughter] 360 would have been um 6 minutes not 60
minutes thanks um okay next up is uh
transcriptions okay and now this is a bit of work okay uh but you can add
transcriptions in as many languages as you want directly into here okay and uh
these transcriptions can be uh close captions sub titles descriptions and
chapters okay so if you want to divvy up your um video into chapters so you can
give people chapters to navigate through okay you can do that but um in order to do that you need
to get uh a tool that creates these vtt files okay it's a standard file um that
uh there's now actually if you load your videos into YouTube um YouTube can
actually transcribe a video for you you can actually download those vtt files for free so that's kind of cool um but
there are various other services I use a service called happy scribe okay um I
actually got it on app Sumo years ago um and uh yeah it'll generate VT files for
me um I'm Wonder there's probably some apps on the App Store if you're really into it um I'm I'm sure there has to be
some apps that will generate these for you um but it is is it is some work okay
and you will have to upload that file to your server um and then give the URL just like a URL to your video file you
have to put that URL into this stack okay and you can have as many of
these as you want so if you have a a German track and an English track um and you can do captions and chapters okay um
oops um so yeah there we go that is transcriptions I I have not
set up a demo for those yet um yeah just ran out of time but I I hopefully I'll
I'll get a video probably a shorter video transcribe it um and then uh yeah
and then create all of that stuff for it okay so that's transcriptions and it is
a lot of work um for accessibility sake might want to look if it's a kind of a
requirement um you know I I did do very cursory um and it's not def definitive
that transcriptions for videos are required from an ada standpoint or an access accessibility standpoint um a lot
of the laws just say your your website has to be made accessible um so it's up to you whether
or not that includes videos or not okay but um there we go okay um call to actions uh you just
click on that we have some options here we're going to dive into those uh in that particular demo and a few other
features that we didn't talk about yet um this actually integrates with um analytics and tracking things so if
you're using Facebook pixels Google analytics or Google tag manager um basically video Pro will send events um
to those particular trackers based on whether or not the video has started um if it hits various markers and if the
video's ended okay so uh that way you can you know do maybe do some retargeting if with Facebook pixels or
something like that you know Target someone that actually watched your video okay um so there you go
um that's some interesting use cases um now if you want to use other trackers um like my call to action stack integrates
with things like um matomo and um go squared and a couple others right um and
so if you want to integrate with those you can actually just use a CTA okay enable ctas and then you can
actually configure and um integrate with my call to action stack to do
that okay um um
cool excellent so let's dive into I do want to note that you can use YouTube
and Vimeo URLs um although I there was there is a
bug in the Shi version I've already fixed it um so in your url you just put a YouTube URL and if we look at this one
here okay um we'll see that oops cck
there it goes it loads the YouTube embed uh but inside uh the video player of
video Pro okay so um interesting feature um there you go and it does use um when
it loads from YouTube it loads the no cookie version of the YouTube embed okay
so it it does load the more secure less intrusive version of the YouTube
embed okay um same thing for Vimeo okay you can just Chuck in a Vimeo URL and um
that will work as
well interesting that YouTube embed that I just previewed it's still playing in
the background even though I'm not previewed oh there we go that was crazy
very interesting okay anyway um let's look at the playlist
okay um so pretty simple uh here is a video Pro um I've gone ahead and turn on
playlist now when you turn on playlist you can you have a couple extra buttons that you have the ability to turn on and
off it's the ability to go from next in previous videos in the playlist now um when you do
that you can go ahead and add multiple videos in here I should actually add you can add as many videos as you want I'm
just to this little blue plus button okay um now when we look look at these what you're going to want to do is uh
you're going to turn on add playlist support okay and what that will do is
that's going to unveil some new settings for us and it gives us a thumbnail a
title and a description and those are important because that's what actually shows up in
the playlist okay now if you don't have a thumbnail you just omit that and it will
basically all this text Will kind of go flush left okay it actually still looks quite nice without a thumbnail if you
don't want to supply a thumbnail okay um you don't have to supply a description
um I would recommend having a title though at least okay um so that you can
you know actually see what the videos are okay and that's pretty much it for a
playlist I mean it's simple um you just upload again the same video URL you put in the type of video it is um and then
you add playlist support and then you put in your additional information that will then display in inside of that
playlist that's really it with playlist it's really simple good interface um before we dive into ctas
let's just show this uh this hover uh demo okay
and what's unique about this is so I turned on looping a video okay I turned
on play on Hover and then I turned on always hide controls and then I turned on hide play button and that's how I was
able to achieve um this look where if I Loop it plays the video when I hover over it and the video is just
going to keep playing over and over and over again until I un
hover so there we go it restarts okay um I also have um show poster when ended
and show poster when paused um enabled actually I probably don't need show poster when ended since it's in Loop um
so that probably doesn't make sense or doesn't doesn't really matter um but yeah show poster when paused probably
makes definitely makes sense because I want to show the poster when I'm un hovering from it right just to show you if I turn that off right and I hover
over it's going to play and basically without that I mean when you un hover for this particular video doesn't make
sense maybe the video that you're displaying it does but I think it looks better um at least for this particular
video to show the poster uh when it's paused AKA un
hovered right so there we go so that was all the magic that we needed to um
create this particular demo all right let's go into ctas now
okay which I think is the bread and butter um it is the feature the selling feature of the stack I think the the the
biggest selling feature okay um there aren't many things out there that allow you to create call to
actions within your video player uh which is a very cool thing
okay so as we see in this demo let's go ahead and make this a little bit bigger right I'm in video Pro um I go
let's scroll down I said add C uh player ctas what you can do is you can set a
background color okay so you can configure the background color and opacity um of whatever the background is
going to be okay you can set the color of the close button and then you can set the blur
radius okay um now in this particular demo um I've added two different ctas in
here okay um I've added there's actually three ctas I believe first I added um
and you can add as many as you want just click this the plus button when you turn on um ctas it adds a new Drop Zone area
and you can add in your ctas now when you add a new one you'll see that there's a drop zone that is the
the contents that you're going to add to place inside of the
CTA and let's look at this stack um basically there's only a couple settings um so after the video ends is the
default so it'll do a CTA when the video ends you can also do after a marker now
when you choose after marker you're going to put in the actual marker
location now this means that uh you have to make sure that it is a marker that you've defined inside of the video stack
so here I've defined three and 10 so um in here this has to be three or 10
okay if it's a nine the CTA will never launch okay because it has to be a configured
marker next is uh we have the ability to pause the video or keep the video
playing okay let's look at some of these examples here so I'm going to go ahead and
actually over here we're going to we're going to set that to be oops uh completely
transparent right and let's look at that right so I'm going to go ahead and play
this and what we'll see is after 3
seconds okay you see after 3 seconds my CTA now I I made this one very subtle
and that all it is is a little button up here at the top right corner or yeah top left corner sorry
right and maybe this button goes somewhere maybe it's a buy button maybe during your video you're like hey click on this button now you know something
like that okay and uh yeah click this button to attend this webinar or to buy this amazing product or whatever you
want right uh I just wanted to show you that you can make these ctas it doesn't need to be like a full screen thing it
could be just a button right here let's look at that really quick and basically
what I did is um here's the CTA um I I configured it to be after the marker at
3 seconds and basically what I do is I just have a Target stack um if you have Foundation 6 you could use a a position
Swatch as well and a button stack and that's it and I set Target to go up to the top right corner okay by default um
content will be centered okay within um within the video okay but uh
with this video CTA or with Target I'm moving it up to the top left
corner pretty cool all right let's look at this other one here now this particular one is going to launch at 10
seconds okay this uh oh and also I should say that this particular one if you notice the video kept
playing um that is because I I just it's an unobtrusive CTA and I don't want to
stop the video for it right so this particular CTA does not pause the
video but this particular one at 10 seconds I do want to pause the video because this particular one is going to
maybe replace the the contents or it's going to Overlay the the video and we want to make sure that we see um what we
want right okay so let's go ahead and preview that we're going to wait 10 seconds so
we'll see it's it's right at this other marker down here so there's my one my first CTA came up and after it hits this
Mark here the second CTA is going to come okay and it looks like there's a
bug in the pause because yeah I'm going to have to fix that uh that that didn't
pause either even though I said it to say pause so um that was a feature I added this morning um the feature you
guys have uh right now doesn't have the pause video feature um so yeah looks like I need to do a little bit more
testing on that but let's pretend that it actually worked okay so if we go over
here let's just go ahead and and pause okay so as you see here um
I just manually paused it this CTA is pretty much taken over okay and uh yeah
I can make this if you wanted you can make this full screen as well okay and actually traditionally let's go ahead
and look at if I go ahead and change the style of the the CTA we're going to go
ahead and go to um let's go like to something like this something like
that and we're going to blur five pixels I think this is close to what the default values are let's let's see what
that
does all right so as you see see here and uh by default it it creates like an
overlay over the whole video and again by default it should pause the video as well
um and but for this particular CTA because it's just a button up at the top I I made this entire background
transparent right um so it makes sense for a little button CTA like this but if
we go to this other CTA which is further down oops
right this particular stylist CTA this makes perfect sense right because um this CTA is going to pause the video
it's kind of putting something directly in the middle of the video and uh yeah
uh I think it makes sense for this type of CTA which is pretty cool okay um now the
very last CTA on this page I think it's when the video
ends okay there it goes it's this uh peekaboo we saw when that video Ed peekabooo drop down here okay and let's
look at how that's done so that is done um actually
completely outside of um the video Pro stack essentially um
and actually a reminder I actually going to ship a update to call to action after this um so that you can get
this feature because um I didn't ship I didn't ship this update to call to action yet um in call to action you can
go ahead if you click plus you'll notice that there is going to be a video Pro um trigger
here okay um I also um added a foundation 6 forms trigger prior you'd
have to use the external trigger but I actually in this update for call to action um there's an a specific one just
for foundation 6 forms now you don't have to use the external trigger um external trigger will still work I
didn't remove it for backwards compatibility sake but yeah I thought it would be better just to kind of create its own but now there's one for video
Pro and let look at what that is so in video Pro um essentially what
you can do is you can say um you can launch a CTA when the video starts when
the video ends or when a marker is reached okay now another thing that it
does is you can actually support um on this oh well this particular page I only
have one video okay um if you only have one video it's fine but um basically what you could do is you can actually um
add a criteria um so this particular video has the word outro in the video
name okay and so what this does is you can put in words in here that will match
against the video URL that's currently triggering the cult actions and then um
if it doesn't match it this called action will be ignored okay so like for example um on the main demo when I have
like four or five different instances I only want to trigger this CTA on particular instances not all of them
right um so particular videos and uh so this allows you to limit um which video
your call to action is actually going to get triggered against hopefully that makes sense okay
so in this case I set it to be video ended um and then um inside call to action you set up your action so this
one is you know it's going to launch a peekaboo and then here's the peekaboo instance that it launches okay and
peekaboo just kind of unveils the content below okay but you can do all kinds of other stuff right um if you're
called action it's super powerful you can launch light boxes you can um send
events to a Toggler or light boxes you can also um you can also send stuff to
uh analytics trackers so if you want to send some custom data to matomo or goost squir or clicky clicky was the other one
I couldn't think of okay um so there we go um and yeah um I'm not going to dive
all into call to action super powerful stack and again it allows you to trigger actions from not only my stuff but a lot
of thirdparty stacks as you see here from this drop down um a lot of them are light boxes or light light box style
Stacks modal uh type of stacks but things like peekaboo um the foundation 6
Toggler super so you can like toggle a class on something based on whether or not a video is played super powerful um
there we go all right let me see if there's any questions here is it possible to use
animations with the CTA
um I'm not sure what animations you're hoping to uh use Bruno um like
animations inside like you can do hover animations and stuff like that um it's just a Swatch um so yeah if you if you
had swatches you should be able to use swatches on anything inside here if you have any sort of complex CTA okay let's
say you wanted a subscription form okay
um what I'd recommend is if you wanted something uh more complex that needed to be interacted with what you're going to
do is you're going to inside of the CTA you're going to put in let's say an off-site stack that is an iframe and
then that is going to iframe into let's say a a web page that has just a
subscription form okay and then basically to the user they're not going to know it's an if frame it'll look like
it's natively right there but um yeah for you uh it'll just you know
seamlessly go through the iframe and it'll interact and you can have a subscription form or any sort of um you
know form or widget that you want that maybe is a little bit more complex than
what can be added directly to a CTA okay basically um you know if you have stuff
that relies on a lot of JavaScript or things like that that you want to have inside of the CTA it might or might not
work okay it's kind of like a rain check sort of thing where um the the contents of the CTA doesn't actually exist on the
page until the user until it actually launched okay so um yeah basically if
you have something mildly complex that you want to have inside the CTA um I think the best approach for now at least
is um an iframe
okay um yeah uh I think I reviewed pretty much everything about this stack
every nook and cranny of it um I look forward to um yeah seeing your feedback
hopefully you guys enjoy it you can build a lot of really powerful stuff with this I'm excited to see uh where we
take things right um some of the features I've already added this morning such as um I think CTA Styles in the
version you have you can't like do the background colors and stuff yet um that is a feature I added I believe it was
this morning um all the days are fogged and they're all merging together now right so um yeah U really good stack uh
and like I said if you want a serious video player um this is this is it right
um it is really a a serious video player um it doesn't have some of the bells and
whistles and nice beautiful animations like something like play or impact or um it doesn't have features like video wall
um oh one thing I should say Okay um video Pro does and should
work I don't have demos of it but it should work perfectly with feeds or total CMS to autogenerate stuff okay um
so you can autogenerate different video Pro you can also Chuck a feeds down into
here and generate um you know videos um you can also I mean you can do a lot
okay so um yeah feeds or total CS you can generate these you can generate video Pros um there's all kinds of
different ways you can approach this depending on what you want to do um but it should work seamlessly with feeds and
total CMS um to generate your content and you should be able to use the various macros within all of these
fields which is pretty
exciting cool well with that guys you know I I thought I was going to be a little bit quicker we're at almost an
hour so um cool thank you very much I appreciate it hope you like going and check it out um there is a discounted
upgrade available for those that own my HTML 5 video stack um this product is a
completely different Beast um it does a lot more but I wanted to up offer an upgrade for those that own my HTML 5
video stack um so you get a a $15 um $15 off uh video Pro if you already own that
stack just use the same email that you um Ed to purchase HTML 5 video Even if
you purchased it 10 years ago because that Stack's been around for a long long time so um cool thank you very much
everybody I hope you have a wonderful rest of your week and uh go forth and make your websites great bye
Search the page
0