> For the complete documentation index, see [llms.txt](https://docs.buidlbuidl.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.buidlbuidl.com/btcpayserver/create-a-btcpay-checkout/embedded-donation-button.md).

# Setup a store

## Step 1. Create a new store

Navigate to 'stores' and click on 'create new store'.

![](/files/-Mh8BCzzNx3PtkFNYKZA)

## Step 2. Enter a name

Add the name of your store and click 'create'.

![](/files/-Mh8BiXPkF_qOAXdVKXh)

## Step 3. Link your BTC onchain and lightning wallet

To receive funds using your BTCPay store you need to connect a onchain and lightning wallet. Click on setup to select.

![](/files/-Mh8C8ttnGS9aZ8P2EXf)

### BTC onchain wallet

For the BTC onchain wallet choose 'connect an existing wallet'.

![](/files/-Mh8CokASKBtP46t1C3P)

**For Coldcard**: choose 'import a wallet file' and import the file found under&#x20;

Advanced ❯ MicroSD Card ❯ Electrum Wallet

![](/files/-Mh8DEUumAqwIhaL7FRC)

**For Ledger**: choose 'enter extended public key'

![](/files/-Mh8E7hJrExpVubfmoot)

Open your Ledger Live desktop application and navigate to: Accounts ❯ btc account of choice ❯ edit account ❯ advanced.

It will show your xpub key in the following format:

```
{
  "xpub": "xpub6Cw352AZWGWxEkwv3E3pAhKxtFiiMPG93JnW92WFVj8BndSN1B2MEMFzXp3m4pmc1yXunJ7kG9y9pzbTXSeXdX94vH8BkXUWdLtJDmyC77y",
  "index": 0,
  "freshAddressPath": "49'/0'/0'/0/1",
  "id": "libcore:1:bitcoin:xpub6Cw352AZWGWxEkwv3E3pAhKxtFiiMPG93JnW92WFVj8BndSN1B2MEMFzXp3m4pmc1yXunJ7kG9y9pzbTXSeXdX94vH8BkXUWdLtJDmyC77y:segwit",
  "blockHeight": 695864
}
```

Only copy the xpub key as the following:

```
xpub6Cw352AZWGWxEkwv3E3pAhKxtFiiMPG93JnW92WFVj8BndSN1B2MEMFzXp3m4pmc1yXunJ7kG9y9pzbTXSeXdX94vH8BkXUWdLtJDmyC77y
```

Go back to BTCPay server, paste your extended public key and click 'continue'.

![](/files/-Mh8FhgFnFMMLoI8a2FF)

Please check that your BTC wallet is generating the same addresses as below and hit 'confirm'.

![](/files/-Mh8H7N-C1obfrFA-XEL)

Your BTC onchain wallet is now configured.

![](/files/-Mh8HJYegP0GWiFkFH_b)

###

### BTC Lightning wallet

To setup a lightning wallet click the 'setup' button.

![](/files/-Mh8Hc3tzJo23y6UlMP8)

Click the button 'use internal node'.

![](/files/-Mh8I16dnEeyGz0d_TJf)

Click 'save'.

Your lightning wallet is now linked to your Umbrel node lightning wallet.

![](/files/-Mh8ICvYykI031dCEzoz)

## Step 4. Edit general settings

* Enter your website URL in the 'Store Website' field.
* Enable 'Allow anyone to create invoice'
* Edit the following payment settings as wanted and click 'save store settings'.

![](/files/-Mh8LW67PrWdOlhSPNpT)

* Optional: edit the SMTP settings of your stores email to send checkout confirmation emails.

![](/files/-Mh8M0VtY49H5CqGND9F)

## Step 5. Edit payment rates

As price source choose for `Coingecko`

To show the right currency conversion in the checkout UI enter the needed curency pairs as follows:

`BTC_USD,BTC_EUR`

You can add/delete other currency pairs when needed.

Click save.

## Step 6. Checkout experience

Here you can setup a default checkout method (Onchain or lightning) OR a hybrid default setting selected by the payment amount.

![](/files/-Mh8QPCXfl7b-2S-o6WY)

Select the following checkmarks:

![](/files/-Mh8QihUDdGKfgtTTb7D)

For custom logo and CSS settings, follow the instructions  [Customize checkout UI](/btcpayserver/customize-design.md).

Click save.

## Step 7. Add users

Add access to your store to other users (Guest will not be able to see and modify the store settings) Note that the user must have a registered account on this BTCPay Server.

Navigate to 'users' and add the email of the user you want to add.

![](/files/-Mh8RiXYBoBx5dPnODwI)

Click '+ Add user' and hit 'save'.

## Step 8. Create embedded payment button

To start using Pay Buttons you need to explicitly turn on 'allow outside world to create invoices via API'. Once you do so, any 3rd party entity will be able to create an invoice on your instance store (via API for example).

![](/files/-Mh8SWxVJLz3wn7AZ3nH)

In settings, edit the following fields:

* **Price**: Enter the default amount and fiat currency conversion.
* **Checkout description**: enter the text you want to appear when a user does a checkout.
* Enable `Customize text in button`
* **Pay Button Text**: enter the button text
* **Pay Button Image Url**: [enter the logo url](/btcpayserver/customize-design/custom-logo.md)
* **Image Size**: choose a button size
* **Button Type**: choose one of the following options:
  1. *Fixed amount*&#x20;
  2. *Custom amount*&#x20;
  3. *Slider*
* **Send Email Notifications to**: enter a email to which BTCPay has to send an email in case of a successful customer checkout.
* **Browser Redirect**: enter the url which has to be shown to the user after a successful checkout.

Copy the generated embedded code and paste it on your website.

```
<style type="text/css"> .btcpay-form { display: inline-flex; align-items: center; justify-content: center; } .btcpay-form--inline { flex-direction: row; } .btcpay-form--block { flex-direction: column; } .btcpay-form--inline .submit { margin-left: 15px; } .btcpay-form--block select { margin-bottom: 10px; } .btcpay-form .btcpay-custom-container{ text-align: center; }.btcpay-custom { display: flex; align-items: center; justify-content: center; } .btcpay-form .plus-minus { cursor:pointer; font-size:25px; line-height: 25px; background: #DFE0E1; height: 30px; width: 45px; border:none; border-radius: 60px; margin: auto 5px; display: inline-flex; justify-content: center; } .btcpay-form select { -moz-appearance: none; -webkit-appearance: none; appearance: none; color: currentColor; background: transparent; border:1px solid transparent; display: block; padding: 1px; margin-left: auto; margin-right: auto; font-size: 11px; cursor: pointer; } .btcpay-form select:hover { border-color: #ccc; } #btcpay-input-price { -moz-appearance: none; -webkit-appearance: none; border: none; box-shadow: none; text-align: center; font-size: 25px; margin: auto; border-radius: 5px; line-height: 35px; background: #fff; } #btcpay-input-price::-webkit-outer-spin-button, #btcpay-input-price::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } </style>
<style type="text/css"> input[type=range].btcpay-input-range { -webkit-appearance:none; width:100%; background: transparent; } input[type=range].btcpay-input-range:focus { outline:0; } input[type=range].btcpay-input-range::-webkit-slider-runnable-track { width:100%; height:3.1px; cursor:pointer; box-shadow:0 0 1.7px #020,0 0 0 #003c00; background:#f3f3f3; border-radius:1px; border:0; } input[type=range].btcpay-input-range::-webkit-slider-thumb { box-shadow:none; border:2.5px solid #cedc21; height:22px; width:22px; border-radius:50%; background:#0f3723; cursor:pointer; -webkit-appearance:none; margin-top:-9.45px } input[type=range].btcpay-input-range:focus::-webkit-slider-runnable-track { background:#fff; } input[type=range].btcpay-input-range::-moz-range-track { width:100%; height:3.1px; cursor:pointer; box-shadow:0 0 1.7px #020,0 0 0 #003c00; background:#f3f3f3; border-radius:1px; border:0; } input[type=range].btcpay-input-range::-moz-range-thumb { box-shadow:none; border:2.5px solid #cedc21; height:22px; width:22px; border-radius:50%; background:#0f3723; cursor:pointer; } input[type=range].btcpay-input-range::-ms-track { width:100%; height:3.1px; cursor:pointer; background:0 0; border-color:transparent; color:transparent; } input[type=range].btcpay-input-range::-ms-fill-lower { background:#e6e6e6; border:0; border-radius:2px; box-shadow:0 0 1.7px #020,0 0 0 #003c00; } input[type=range].btcpay-input-range::-ms-fill-upper { background:#f3f3f3; border:0; border-radius:2px; box-shadow:0 0 1.7px #020,0 0 0 #003c00; } input[type=range].btcpay-input-range::-ms-thumb { box-shadow:none; border:2.5px solid #cedc21; height:22px; width:22px; border-radius:50%; background:#0f3723; cursor:pointer; height:3.1px; } input[type=range].btcpay-input-range:focus::-ms-fill-lower { background:#f3f3f3; } input[type=range].btcpay-input-range:focus::-ms-fill-upper { background:#fff; } </style>
<form method="POST"  action="https://pay.buidlbuidl.com/api/v1/invoices" class="btcpay-form btcpay-form--block">
  <input type="hidden" name="storeId" value="6qxoxSsEVYYhFZzUcmGjc2Ko9ratMJxFPKQsSCeEpLti" />
  <input type="hidden" name="checkoutDesc" value="Test" />
  <div class="btcpay-custom-container">
    <input id="btcpay-input-price" name="price" type="text" min="0" max="none" step="any" value="10" style="width: 209px;" oninput="event.preventDefault();isNaN(event.target.value)? document.querySelector('#btcpay-input-price').value = 10 : event.target.value; if (this.value < undefined) {this.value = undefined; } else if(this.value > undefined){  this.value = undefined;}" onchange= "var el=document.querySelector('#btcpay-input-price'); var price = parseInt(el.value);  if(price< 1) { el.value = 1} else if(price> 200) { el.value = 200} document.querySelector('#btcpay-input-range').value = el.value" />
    <select name="currency">
      <option value="USD" selected>USD</option>
      <option value="GBP">GBP</option>
      <option value="EUR">EUR</option>
      <option value="BTC">BTC</option>
    </select>
    <input class="btcpay-input-range" id="btcpay-input-range" value="10" type="range" min="1" max="200" step="1" style="width:209px;margin-bottom:15px;" oninput="document.querySelector('#btcpay-input-price').value = document.querySelector('#btcpay-input-range').value" />
  </div>
<button type="submit" class="submit" name="submit" style="min-width:209px; min-height:57px; border-radius: 4px;border-style: none;background-color: #0f3b21;" alt="Pay with BtcPay, Self-Hosted Bitcoin Payment Processor"><span style="color:#fff">Pay with</span>
<img src="https://pay.buidlbuidl.com/img/logo.svg" style="height:57px;display:inline-block;padding: 5% 0 5% 5px;vertical-align: middle;">
</button></form>
```

Your store is now setup!


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.buidlbuidl.com/btcpayserver/create-a-btcpay-checkout/embedded-donation-button.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
