FAQ & Troubleshooting

Frequently Asked Questions

How do I determine the ID for my chatbot shortcode?

The ID corresponds to the row number of the URL you entered in the plugin settings. For example, if you entered three URLs:

1. https://bot-one.supervised.co -> Use [supervised_ai_bot id="1"]
2. https://bot-two.supervised.co -> Use [supervised_ai_bot id="2"]
3. https://bot-three.supervised.co -> Use [supervised_ai_bot id="3"]

Can I add multiple chatbots to the same page?

Yes. You can place multiple shortcodes on a single page or post. However, ensure each shortcode uses the correct id attribute to load the intended bot configuration.

Does the plugin support mobile devices?

Yes, the chatbot interface is designed to be responsive. The popup is fixed to the bottom right of the screen to ensure accessibility on both desktop and mobile browsers.

Can I customize the look of the chat button or popup?

Currently, basic styling is handled via the plugin's internal CSS. If you wish to override these styles (such as changing the button color), you can add custom CSS to your theme's "Additional CSS" section targeting the .circle-button or .popup-container classes.

Troubleshooting

The shortcode is appearing as plain text on my page

If you see [supervised_ai_bot id="1"] printed on your website instead of the chat button:

1. Check Plugin Activation: Ensure the "Supervised AI Bots" plugin is activated in the WordPress Plugins menu.
2. Check Syntax: Ensure you are using straight quotes (" ") rather than curly/smart quotes (“ ”) in the shortcode attributes.
3. Widget Support: If using the shortcode in a sidebar or footer widget, ensure your theme supports shortcodes in text widgets.

The chat popup is blank or says "Connection Refused"

This is typically a security configuration issue on the bot's hosting side:

• Iframe Permissions: Ensure the Supervised AI Bot URL allows "iframing." If the bot server sends an X-Frame-Options: DENY or SAMEORIGIN header, it will not load inside your WordPress site.
• SSL Mismatch: If your website uses https://, your bot URL must also use https://. Most browsers block "Mixed Content" (loading an http bot on an https site).

The Chat button is hidden behind my website's header or menu

This is usually caused by a CSS z-index conflict where your theme's elements have a higher priority than the chatbot.

• Solution: Add the following CSS to your theme to force the chatbot to the front:

.circle-button {
    z-index: 99999 !important;
}
.popup-container {
    z-index: 99999 !important;
}

The Chatbot button is not appearing at all

1. Check Settings: Verify that you have added the bot URL in the 'Supervised AI Bots' settings page.
2. JavaScript Errors: Open your browser's developer console (F12). If you see errors related to togglePopup or custom-popup-script.js, there may be a conflict with another plugin's JavaScript.
3. Caching: If you use a caching plugin (like WP Rocket or W3 Total Cache), clear your site cache after adding a new bot.

The popup window is too small for my bot

The default dimensions are set to a height of 670px and a width of 400px. If your bot requires more space, you can adjust this by adding custom CSS:

.popup-container {
    width: 500px; /* Adjust width as needed */
    height: 800px; /* Adjust height as needed */
}
.popup-body, .iframe-container {
    height: 800px; /* Must match the container height */
}