Buy buttons
Buy buttons are the simplest way to add Plandalf to an existing page.
HTML button
<button data-plandalf-present="pro-plan">
Buy Pro
</button>HTML link
<a href="/pricing" data-plandalf-present="pro-plan">
Upgrade
</a>The SDK intercepts the click and opens checkout instead of following the link.
Programmatic button
document.querySelector("#upgrade").addEventListener("click", async () => {
const result = await plandalf.present("pro-plan", {
frame: "modal",
user: customerJwt
});
if (result.status === "complete") {
window.location.href = "/account";
}
});Promo-aware button
<button
data-plandalf-present="summit-ticket"
data-plandalf-apply-promo="early-bird"
>
Buy before the price changes
</button>