Embed a HyperCard stack

Two ways to put a stack on your page. Both run the stack entirely in the browser — nothing is uploaded.

1. Web component (recommended)

Load the script once, then use the <hypercard-stack> tag. Size it with CSS.

<script src="../hypercard-embed.js"></script>
<hypercard-stack stack="../MyStack.zip"
                 style="width:640px; aspect-ratio:640/400"></hypercard-stack>

2. iframe

Point an <iframe> at viewer.html with the stack in the query string. Handy when you can't add a script tag to the page.

<iframe src="../viewer.html?stack=MyStack.zip"
        width="640" height="400" style="border:0"></iframe>

Both examples reference a MyStack.zip one directory up. Replace it with your own stack's zip filename. See the kit README or the embedding guide for how to prepare (zip) a stack.