> For the complete documentation index, see [llms.txt](https://style-protocol.gitbook.io/sdk/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://style-protocol.gitbook.io/sdk/overview/try-sdk/try-iframe-for-web.md).

# Try IFrame for Web

Take less than 15 minutes to integrate the STYLE Marketplace with a website using an iframe.

### [Demo](https://style-protocol.github.io/STYLE-Protocol-SDK/)

<figure><img src="/files/Vv42E4D3Zp4MuF0eBhgd" alt=""><figcaption><p>STYLE Marketplace Example</p></figcaption></figure>

### **Simplfied Code**

The HTML code for integrating the STYLE Marketplace into a webpage contains

* an iframe to hold the STYLE Marketplace from the style-protocol.github.io/STYLE-Protocol-SDK domain
* script code that communicates with the server

### **Embed the** STYLE Marketplace **into a webpage**

1. Create a new file in a text editor.&#x20;
2. Copy and paste the code below into the file.&#x20;
3. Save the file with an .html extension.&#x20;
4. Open the file in a web browser. You should see the iframed STYLE Marketplace and can now buy NFTs.

### **Copy this code**

```
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
    />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
    <style>
      html,
      body,
      .frame {
        width: 100%;
        height: 100%;
        margin: 0;
        border: none;
      }
    </style>
  </head>

  <body>
    <iframe
      id="frame"
      class="frame"
      src="https://style-protocol.github.io/STYLE-Protocol-SDK/"
    ></iframe>
  </body>
</html>
```

{% hint style="info" %}
[Repository](https://github.com/STYLE-Protocol/STYLE-Protocol-SDK)
{% endhint %}
