> For the complete documentation index, see [llms.txt](https://docs.wonderchat.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.wonderchat.io/setup-guides/adding-your-chatbot-to-your-website/embedding-for-wordpress.md).

# Embedding for WordPress

Please first read our article on [**How to Embed A Chat Widget**](/setup-guides/adding-your-chatbot-to-your-website/how-to-embed-a-chat-widget.md) to fetch the chat widget embed code from our site into the WordPress.

This article below covers where to add the chat widget code into your WordPress site.

***

## **Step 1: Login to WordPress**

Log in to your WordPress account, and then:

1. Go to the Dashboard.
2. Click **Plugins > Add New**.
3. Search for "Header and Footer Scripts."

<figure><img src="/files/EsRJnu5MGNoWfooO4vyZ" alt=""><figcaption><p>Header and Footer Scripts Plugin</p></figcaption></figure>

***

## Step 2: Install Plugin

Install the "Header and Footer Scripts" plugin, then click **Activate**.

* After installation, you'll see a "**Header and Footer Scripts**" menu under **Settings**.

***

## Step 3: Paste Chat Widget Code

Paste your Wonderchat chat widget code into the "Scripts in Footer" box, then click **Save**.

<figure><img src="/files/wL9cL0aT7KnC8N4ISC3K" alt=""><figcaption><p>Paste the <strong>copied embed code</strong> into the box, and click on <strong>"Save"</strong> to make changes</p></figcaption></figure>

### Optional: Adjust Chatbot Size

If the chatbot widget needs to be resized or repositioned, you can modify your changes on the [**Wonderchat App**](https://app.wonderchat.io/) before copying the embed code over.

<figure><img src="/files/6cWdZJ8nLZpJyKXtWiM3" alt=""><figcaption><p>Configure your customizations and preview widget, before copying the embed code over</p></figcaption></figure>

For a more detailed guide on how customize your chat widget or page, see the pages below:

[Chat Widget Embedding](/setup-guides/adding-your-chatbot-to-your-website/how-to-embed-a-chat-widget.md)

[Chat Screen Embedding](/setup-guides/adding-your-chatbot-to-your-website/how-to-embed-a-chat-screen.md)

***

## Step 4: Test Your Chatbot

Ensure the chatbot works properly by interacting with it on your live store. Test the chatbot's functionality across different devices (desktop, tablet, mobile) to make sure it's responsive.

***

If you have any more questions, feel free to reach out to us at <mark style="color:purple;">**<support@wonderchat.io>**</mark>
