Praxis Wiki logo

Earlier Integrations |Cashier Frame Code Example


<!DOCTYPE html>
<html>
<head>
    <title>Cashier</title>
</head>

<body>
    <!-- Header -->
    <!-- Navigation Menu -->
    <h2>INSTRUCTIONS</h2>
    Example: Embedded Cashier iframe
    <ol>
        <li>Set minimum dimensions and adjust height dynamically using PostMessage</li>
        <li>Try avoiding scrollbars</li>
        <li>Add bounceback fix for Safari browsers</li>
    </ol>
    <!-- Script that POSTs customer login to create customer session @ Cashier -->
    <iframe src="/cashier-frame.php?r=e7e5cd4004b66cb798105bc88b4f9f45b06f2a02" 
    marginwidth="0" 
    marginheight="0" 
    width="700" 
    min-height="700" 
    scrolling="auto" 
    frameborder="0" 
    allowtransparency="yes" 
    name="CashierFrame" 
    id="CashierFrame"></iframe>

    <script>
        // Create IE + others compatible event handler
        var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
        var eventer = window[eventMethod];
        var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";

        // Listen to message from child window
        eventer(messageEvent,function(e) {
            // OPTIONAL - check if request comes from authorized domain
            //if (e.origin == "https://cashier.yoursite.com") {
                document.getElementById('CashierFrame').height = e.data + 'px';
                // search Cashier iframe by ID and set height property
            //}
        },false);
    </script>
    <!-- Page Footer -->
</body>
</html>

You are currently viewing version 3.1 Latest version here