# Source: https://docs.chatling.ai/web-widget/installation/wordpress.md

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.chatling.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# WordPress

> Learn how to add Chatling to your WordPress website

## Method 1: Install using a plugin

1. Go to your dashboard.
2. Click `Deploy` button in the sidebar menu.

<img src="https://chatling-assets.b-cdn.net/deploy-ai-agent.jpg" width="500" alt="Open Deploy page" />

3. Click the `Manage` button under the `Website Widget` option.

<img src="https://chatling-assets.b-cdn.net/manage-website-widget-chatbot.jpg" width="600" alt="Manage website widget" />

4. Design the appearance of the widget by clicking the `Open widget designer` button.

<img src="https://chatling-assets.b-cdn.net/open-website-widget-designer.jpg" width="500" alt="Open website widget designer" />

5. Select the display mode for your chatbot, such as "Floating Chat", "Inline", or "Fullscreen".

<img src="https://chatling-assets.b-cdn.net/configure-website-widget-display-type.jpg" width="500" alt="Configure website widget display type" />

6. Copy the widget code.

<img src="https://chatling-assets.b-cdn.net/website-widget-code.jpg" width="500" alt="Copy widget code" />

7. In your WordPress dashboard, go to `Plugins` > `Add new plugin`.

<img src="https://chatling-assets.b-cdn.net/add-new-plugin-wordpress.jpg" width="300" alt="Add new plugin" />

8. Search for the `Insert Headers And Footers` plugin and install the one by WPBrigade.

<img src="https://chatling-assets.b-cdn.net/install-insert-header-footer-plugin-wordpress.jpg" width="500" alt="Insert Headers And Footers plugin" />

9. Once installed, activate the plugin.

10. Go to `Settings` > `WP Headers and Footers` from the sidebar.

<img src="https://chatling-assets.b-cdn.net/open-wp-headers-footers-settings.jpg" width="300" alt="Open WP Headers and Footers settings" />

11. Paste the chatbot widget code in the header section.

<img src="https://chatling-assets.b-cdn.net/paste-widget-code-in-wp-headers-footers.jpg" width="400" alt="Add chatbot widget code in the header section" />

12. Click `Save Changes`.

## Method 2: Install using the theme editor

1. Follow steps 1-6 from Method 1 to copy the widget code.

2. Open your WordPress dashboard.

3. From the sidebar menu, select `Appearance` > `Theme File Editor`.

<img src="https://chatling-assets.b-cdn.net/open-wordpress-theme-file-editor.jpg" width="300" alt="Open theme file editor" />

4. Under the `Theme Files` section (right side of the screen), search and open the `header.php` file.

<img src="https://chatling-assets.b-cdn.net/open-theme-header-editor-wordpress.jpg" width="300" alt="Edit theme header" />

5. Paste the widget code before the closing `</head>` tag.

<img src="https://chatling-assets.b-cdn.net/paste-widget-code-in-theme-header-file.jpg" width="500" alt="Embed code in header" />

6. Click `Update File` to save.