Skip to content

Latest commit

 

History

History
96 lines (61 loc) · 3.66 KB

File metadata and controls

96 lines (61 loc) · 3.66 KB

WidgetBot Plugin for FeatherPanel

Integrate WidgetBot Discord chat widgets directly into your FeatherPanel installation. This plugin adds a floating Discord chat widget that allows users to interact with your Discord server without leaving the panel.

Features

  • Discord Chat Integration: Embed a live Discord chat widget using WidgetBot Crate
  • Automatic Injection: WidgetBot automatically appears on all FeatherPanel pages (desktop only)
  • Customizable: Configure button color, position, and notification settings
  • Public API: Access WidgetBot configuration via public API endpoints
  • Embed Support: Generate standalone embed pages for external use
  • Smart Positioning: Automatically positioned to avoid collisions with other UI elements (like FeatherAI agent)

Installation

  1. Install the plugin through the FeatherPanel plugin manager
  2. Navigate to Admin → Plugins → WidgetBot in the admin panel
  3. Configure your Discord server and channel IDs

Configuration

Required Settings

  • Server ID: Your Discord server ID

    • To get your server ID, enable Developer Mode in Discord, right-click your server, and select "Copy Server ID"
    • Make sure to invite the WidgetBot bot first: https://add.widgetbot.io/
  • Channel ID: The Discord channel ID you want to display by default

    • Enable Developer Mode, right-click the channel, and select "Copy Channel ID"

Optional Settings

  • Crate Button Color: Hex color code for the WidgetBot button (e.g., #5865F2 for Discord blue)
  • Crate Vertical Location: Position vertically - top, bottom, or a pixel number
  • Crate Horizontal Location: Position horizontally - left, right, or a pixel number
  • Enable Crate Notifications: Toggle message notifications (true or false)

How It Works

Once configured, the WidgetBot Crate widget will automatically:

  1. Load on all FeatherPanel pages (desktop viewports only)
  2. Display as a floating button in the bottom-left corner (by default, positioned 150px from bottom to avoid UI collisions)
  3. Open a Discord chat widget when clicked
  4. Show your configured Discord server and channel

CSS Customization

The WidgetBot Crate button can be styled using CSS. The button is rendered in a shadow DOM, but you can target it using WidgetBot's CSS injection feature via the configuration options.

Troubleshooting

WidgetBot Not Appearing

  1. Check Configuration: Ensure both server_id and channel_id are set in plugin settings
  2. Bot Invitation: Make sure you've invited the WidgetBot bot to your Discord server: https://add.widgetbot.io/
  3. Desktop Only: The widget only appears on desktop viewports (width ≥ 1024px)
  4. Browser Console: Check the browser console for any JavaScript errors

Configuration Errors

If you see "No configuration provided" message:

  1. Go to Plugins → WidgetBot in the admin panel
  2. Fill in the required server_id and channel_id fields
  3. Save the configuration
  4. Refresh the page

Requirements

  • PHP with PDO extension
  • FeatherPanel v2
  • Valid Discord server and channel IDs
  • WidgetBot bot invited to your Discord server

Support

For WidgetBot-specific issues, visit:

For plugin-specific issues, check the FeatherPanel logs or contact the plugin author.

License

MIT License - See the main FeatherPanel license for details.

Author

  • NaysKUtzu - Initial development

Note: This plugin uses the official WidgetBot Crate library. Make sure to comply with WidgetBot's terms of service when using this integration.