> For the complete documentation index, see [llms.txt](https://docs.niftykit.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.niftykit.com/customize-your-experience/niftykit-diamond-widgets/installation-guides/install-for-wordpress.md).

# Install for WordPress

This tutorial will show you how to install the NiftyKit Diamond Widgets on your WordPress. 

To start, make sure you're in the WordPress page builder.

### 1. Switch to "Code Editor" mode

Depending on your theme or plugins, this view might be different; please refer to the following helpful links:

* <https://wordpress.com/support/editors/>
* <https://www.wpbeginner.com/wp-tutorials/how-to-edit-html-in-wordpress-code-editor-beginners-guide/>

![Highlighted in blue is the Code editor mode](/files/KLQN3pFd80f8AKwk7oh4)

### 2. Paste your SDK widget code

```html
<!-- Import NiftyKit Widgets library -->
<script type="module" src="https://sdk.niftykit.com/widgets/widgets.esm.js"></script>

<nk-diamond collection-id="YOUR-SDK-KEY">
  <nk-is-not-connected>
    <nk-connect-wallet-button>
      Connect Wallet
    </nk-connect-wallet-button>
  </nk-is-not-connected>
  <nk-is-connected>
    <nk-drop-mint-button success-title="Success!" success-message="You did it!">
      Mint NFT
    </nk-drop-mint-button>
  </nk-is-connected>
</nk-diamond>
```

Be sure to replace `YOUR-SDK-KEY` it with your actual SDK key.

### 3. Update your mint page

![](/files/vTgeZeRMK9kSelEuTOCY)

{% hint style="info" %}
This also works in Elementor if you embed the HTML element.
{% endhint %}