> 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>


---

# 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.wonderchat.io/setup-guides/adding-your-chatbot-to-your-website/embedding-for-wordpress.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.