btcpayserver/BTCPayServer/Views/Apps/PayButton.cshtml

@model PayButtonViewModel
@{
    ViewData["Title"] = "Pay Button";
}

<section>
    <div class="container">
        <div class="row">
            <div class="col-lg-12 text-center">
                <h2 class="section-heading">@ViewData["Title"]</h2>
                <hr class="primary">
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12 text-center">
                <partial name="_StatusMessage" for="@TempData["TempDataProperty-StatusMessage"]" />
            </div>
        </div>
        <br />
        <div class="row">
            <div class="col-lg-6">
                <div class="form-row">
                    <div class="form-group col-md-8">
                        <label>Price</label>
                        <input type="text" class="form-control" id="inputEmail4">
                    </div>
                    <div class="form-group col-md-4">
                        <label>&nbsp;</label>
                        <input type="text" class="form-control" id="inputPassword4" value="USD">
                    </div>
                </div>
                <div class="form-group">
                    <label>Checkout Description</label>
                    <input type="text" class="form-control" id="inputAddress" placeholder="(optional)">
                </div>
                <div class="form-group">
                    <label>Order Id</label>
                    <input type="text" class="form-control" id="inputAddress" placeholder="(optional)">
                </div>
                <div class="form-group">
                    <label>Button Size</label>
                    <div style="vertical-align:top; font-size:12px; display:flex;">
                        <button class="btn btn-default" style="width:95px;height:32px;margin-right:40px;">146 x 57 px</button>
                        <button class="btn btn-default" style="width:126px;height:48px;margin-right:40px;">168 x 65 px</button>
                        <button class="btn btn-default" style="width:146px;height:57px;">210 x 82 px</button>
                    </div>
                </div>
            </div>
            <div class="col-lg-6">
                <br />
                Define parameters that define the purchase: price, currency and then optional description of purchase.
                <br /><br />
                Generated HTML will be displayed at the bottom of this page and all you need is to paste that HTML into your final page.
                Clicking on the button will redirect customer to checkout.
            </div>
        </div>
        <hr />
        <h3>Payment Notifications</h3>
        <br />
        <div class="row">
            <div class="col-lg-6">
                <div class="form-group">
                    <label>Server IPN</label>
                    <input type="text" class="form-control" id="inputAddress" placeholder="(optional)">
                </div>
                <div class="form-group">
                    <label>Send Email Notifications to</label>
                    <input type="text" class="form-control" id="inputAddress" placeholder="(optional)">
                </div>
                <div class="form-group">
                    <label>Browser Redirect</label>
                    <input type="text" class="form-control" id="inputAddress" placeholder="(optional)">
                </div>
            </div>
            <div class="col-lg-6">
                <br />
                These parameters allow you to influence process after purchase. <i>Server IPN</i> is location we'll query with details.
                We can also deliver email notification to specified addres.
                <br /><br />
                Finally <i>Browser Redirect</i> defines where BtcPayServer will redirect customer after puchase is completed.
            </div>
        </div>
        <hr />
        <h3>Generated code</h3>
        <div class="row">
            <div class="col-lg-8">
                <pre><code class="html">&lt;form method="POST" action="http://127.0.0.1:14142/apps/3jVExUHqRkGi4eaJEFCTxw5zjk14VAFzoVZXZJ3fbwED/pos"&gt;
    &lt;input type="hidden" name="amount" value="10" /&gt;
    &lt;input type="hidden" name="currency" value="USD" /&gt;
    &lt;button type="submit"&gt;Buy now&lt;/button&gt;
&lt;/form&gt;
</code></pre>
            </div>
            <div class="col-lg-4">
                <img src="~/img/paywithbtcpay.png" />
            </div>
        </div>
        <br />
    </div>
</section>


@section Scripts {
    <link rel="stylesheet" href="~/vendor/highlightjs/default.min.css">
    <script src="~/vendor/highlightjs/highlight.min.js"></script>
    <script>hljs.initHighlightingOnLoad();</script>
}