# Minting Experience using WIX

##

There are two ways to add a minting experience to your WIX app using Zero-Code. After selecting a theme, either dark or light, for the minting experience, you can choose to implement it directly in the body of the page or utilize a lightbox that opens a pop-up when the user clicks on the mint button. In this tutorial, we will guide you through step-by-step instructions for implementing the mint experience in both ways specifically for your WIX app.

### Implementing the Minting Experience in the Body

#### Step 1: Select a Theme 

Choose between a dark or light theme for the minting experience, considering the design that complements your WIX app's aesthetics.

<figure><img src="/files/cv7946o5QenLPQ8VzfOo" alt=""><figcaption></figcaption></figure>

#### Step 2: Copy the Embeddable&#x20;

Link In the Zero-Code interface, find the option to copy the embeddable link for the minting experience. Click on it to copy the provided link to your clipboard.

#### Step 3: Access WIX Editor&#x20;

Log in to your WIX account and navigate to the WIX Editor for the app where you want to implement the minting experience in the body.

<figure><img src="/files/0PS7cJJlmuTGEtwcQ35m" alt=""><figcaption></figcaption></figure>

#### Step 4: Edit Your Page&#x20;

Select the page or section within your app where you want to add the minting experience. Enter the editing mode for that page.

#### Step 5: Add HTML Element&#x20;

In the WIX Editor, find the HTML element in the elements panel and drag it to the desired location on your page.

<div><figure><img src="/files/KI3IN1E6KfTtHRC3ihZv" alt=""><figcaption><p>add dark theme element</p></figcaption></figure> <figure><img src="/files/gkeXDkvjCYNoWdnC9VfA" alt=""><figcaption><p>add light theme element</p></figcaption></figure></div>

#### Step 6: Edit HTML Element&#x20;

With the HTML element selected, click on the settings gear icon. In the settings panel, choose "HTML Settings" and paste the previously copied embeddable link into the HTML code section.

#### Step 7: Save, preview and publish&#x20;

Save your changes and preview your WIX app. Verify that the minting experience appears in the selected location and functions as expected.

<div><figure><img src="/files/rKA70kd0upMwM57pzR0b" alt=""><figcaption><p>preview</p></figcaption></figure> <figure><img src="/files/q5WOyJ8ckYFfIcfg4su8" alt=""><figcaption><p>publish</p></figcaption></figure></div>

### Implementing the Minting Experience using a Lightbox

#### Step 1: Select a Theme&#x20;

Similarly, choose a dark or light theme for the minting experience that suits your WIX app's design.

<figure><img src="/files/cv7946o5QenLPQ8VzfOo" alt=""><figcaption></figcaption></figure>

#### Step 2: Copy the Embeddable Link&#x20;

Copy the embeddable link for the minting experience from the Zero-Code interface, as described in the previous method.

#### Step 3: Access WIX Editor&#x20;

Log in to your WIX account and navigate to the WIX Editor for the app where you want to implement the minting experience using a lightbox.

<figure><img src="/files/0PS7cJJlmuTGEtwcQ35m" alt=""><figcaption></figcaption></figure>

#### Step 4: Add a Button&#x20;

In the WIX Editor, find the button element in the elements panel and drag it to the desired location on your page.

#### Step 5: Edit Button Properties&#x20;

Select the added button, click on the settings gear icon, and customize the button's design and text according to your preference. For example, label it as "Mint" or "Create NFT".

<div><figure><img src="/files/KI3IN1E6KfTtHRC3ihZv" alt=""><figcaption><p>add dark theme element</p></figcaption></figure> <figure><img src="/files/gkeXDkvjCYNoWdnC9VfA" alt=""><figcaption><p>add light theme element</p></figcaption></figure></div>

#### Step 6: Add a Lightbox&#x20;

In the WIX Editor, locate the "Lightbox" element in the elements panel and drag it to the desired location on your page.

<figure><img src="/files/LrLEr7d4hbHBpycF1i9E" alt=""><figcaption></figcaption></figure>

#### Step 7: Configure the Lightbox&#x20;

Customize the lightbox settings by selecting it and clicking on the settings gear icon. Set the lightbox to open when the button is clicked.

<div><figure><img src="/files/p3WXxRxcrgXvCHxG6p7d" alt=""><figcaption></figcaption></figure> <figure><img src="/files/StSICDGbG0LaFnsg79kk" alt=""><figcaption></figcaption></figure></div>

#### Step 8: Insert HTML Code&#x20;

Within the lightbox settings, select the "HTML" option and insert the HTML code provided by Zero-Code for the minting experience. This HTML code will embed the minting experience directly into the lightbox.

<figure><img src="/files/4C6uS4uPbczDfkHGMqfv" alt=""><figcaption></figcaption></figure>

#### Step 9: Save and Preview&#x20;

Save your changes and preview your WIX app. Verify that clicking the mint button opens the lightbox, displaying the minting experience to users.

By following these step-by-step instructions, you can seamlessly integrate a minting experience into your WIX app using Zero-Code. Whether you choose to implement it directly in the body or


---

# Agent Instructions: 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.zero-code.io/web3-builder/minting-experience-using-wix.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.