1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

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

Discussion in 'Making Money' started by appliedscience, Jun 12, 2012.

  1. appliedscience

    appliedscience Regular Member

    Joined:
    Jan 28, 2011
    Messages:
    202
    Likes Received:
    5
    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.
     
  2. bigballin6161

    bigballin6161 Jr. VIP Jr. VIP Premium Member

    Joined:
    Jul 16, 2011
    Messages:
    1,095
    Likes Received:
    424
    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!
     
    • Thanks Thanks x 1
  3. appliedscience

    appliedscience Regular Member

    Joined:
    Jan 28, 2011
    Messages:
    202
    Likes Received:
    5
    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?
     
  4. nesterdwarf

    nesterdwarf Regular Member

    Joined:
    May 30, 2008
    Messages:
    276
    Likes Received:
    539
    Location:
    State of Misery...er, Missouri...
    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
     
    • Thanks Thanks x 4
  5. appliedscience

    appliedscience Regular Member

    Joined:
    Jan 28, 2011
    Messages:
    202
    Likes Received:
    5
    Thanks so much nesterdwarf. Works perfectly!