Add to Cart Button AFTER video finishes.. How??

appliedscience · Jun 12, 2012

Hey all,

I have a static HTML website. I'm going to be hosting a video on one of the pages and I'm wondering how do you get the add to cart button to appear at the end of the video / near the end of the video?

I'm not code savvy but can understand how to implement something if it has clear instructions. I'm hoping there is a product (cheap) or simple code out there I can use - my searches have come up blank.

Even better - if I can have sales copy appear after the video has played to help conversions, rather than just an add to cart button (if possible).

I'm hoping someone can point me in the right direction - maybe even just what the feature is called (then I might have more luck finding what I'm after with searches).

Thanks.

bigballin6161 · Jun 12, 2012

Its called a delayed call to action button. I use optimize press and you just input how many seconds into the video that you want the button to appear. I highly recommend Optimize Press for Sales/Squeeze/membership sites. Its extrememly powerful and $97 for as many sites as you want is a steal!

appliedscience · Jun 12, 2012

Thanks for the reply. I have optimizepress and it's great, but for the site I'm wanting to put this feature on I have just HTML. I searched 'delayed call to action button' and search terms based of that but can't find anything to integrate this feature into a HTML site. Only came across optimizepress and other WP related sites where this would act as a plugin.

Any other ideas how I can find this?

nesterdwarf · Jun 12, 2012

You'll need to combine JS with a little CSS -

Here's the JS that would go in between your <head></head> tags -

Code:

<script type="text/javascript">
     function showdiv() {
          document.getElementById("ID_OF_HIDDEN_DIV").style.display = "block";
     }
     setTimeout("showdiv()", DELAY IN MILLISECONDS);
</script>

And you'd add the following CSS to a div that surrounds your 'Add to Cart' button -

Code:

<div id="ID_OF_HIDDEN_DIV" style="display: none">

     ADD TO CART BUTTON HTML

</div>

The id of the div can be whatever you want as long as it matches in the JS and the delay would be 5 seconds = 5000.

Simple copy and paste example -

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
function showdiv() {
document.getElementById("hidediv1").style.display = "block";
}
setTimeout("showdiv()", 10000);
</script>
</head>
<body>
Wait 10 seconds...
    <div id="hidediv1" style="display: none">
		<br />
		Here is the link!
		<br />
	</div>

</body>
</html>

HTH

ND

appliedscience · Jun 15, 2012

Thanks so much nesterdwarf. Works perfectly!

Add to Cart Button AFTER video finishes.. How??

appliedscience

Regular Member

bigballin6161

Senior Member

appliedscience

Regular Member

nesterdwarf

Regular Member

appliedscience

Regular Member

Main Menu

Marketplace

Making Money

BlackHatWorld

Other