CallBack Bubble

A WordPress plugin that displays a draggable bubble button on mobile devices. When tapped it opens a beautiful internal popup with a contact form, or triggers an external popup of your choice.

Features

• 📱 Mobile-only widget (customizable breakpoint)
• 🎨 Fully customizable via WordPress admin panel
• 🖱️ Draggable with touch support
• 💾 Remembers position and close state via localStorage
• ♿ Accessible (ARIA labels, keyboard navigation)
• 🌍 Translation-ready (i18n support)
• 📝 Built-in popup with form support (WPForms, Contact Form 7, etc.)
• 🔄 External popup mode for custom integrations

Settings

After activating the plugin, go to Settings → CallBack Bubble in your WordPress admin panel to configure:

General Settings

• Enable Widget: Toggle the widget on/off
• Popup Mode: Choose between Internal Popup (with form) or External (CSS selector)
• Popup Selector: CSS selector of the element that opens your popup (external mode only)

Internal Popup Settings

• Popup Title: Main heading displayed in the popup
• Popup Subtitle: Secondary text with support for HTML tags
• Background Image: Optional image URL for popup background
• Form Shortcode: Shortcode for your form plugin (WPForms, CF7, etc.)
• Privacy Text: Privacy notice displayed below the form
• Button Color: Color of the submit button

Bubble Text

• First Line: Main message text
• Second Line: Secondary message text

Colors

• Bubble Background: Background color of the speech bubble
• Text Color: Color of the bubble text
• Notification Color: Color of the pulsing notification dot

Position & Size

• Bottom Distance: Distance from the bottom of the screen (px)
• Side Distance: Distance from the chosen side (px)
• Widget Side: Show the widget on the right or on the left of the viewport
• Widget Size: Size of the main button (px)
• Mobile Breakpoint: Widget only shows below this screen width (px)

Animation Timing

• Initial Delay: Time before the widget appears (ms)
• Bubble Show Delay: Time before the bubble message shows (ms)
• Bubble Display Time: How long the bubble stays visible (ms)
• Repeat Interval: How often the bubble reappears (ms)

Behavior

• Close Duration: How many hours the widget stays hidden after closing
• Vibration: Enable haptic feedback on long press
• Dark Mode: Adapt widget and popup colors to the system prefers-color-scheme: dark
• Excluded Pages: Comma-separated list of post/page IDs where the widget must NOT be shown

Rate Limiting (Anti-Spam)

• Enable Limit: Toggle rate limiting on/off
• Max Requests: Maximum number of requests allowed in the time period (default: 2)
• Period (minutes): Time window for rate limiting (default: 60 minutes)
• Limit Message: Custom message shown when limit is reached

Accessibility

• Honors prefers-reduced-motion (animations disabled when the user requests reduced motion)
• ARIA roles, aria-labelledby and aria-describedby on the modal
• Focus trap: Tab / Shift+Tab stay inside the popup
• ESC to close the popup, focus returns to the widget

Developer Filters

Change the popup target programmatically

add_filter( 'callbackbubble_popup_target', function( $target ) {
    return '[href="#my-popup-id"]';
});

Conditionally hide the widget

add_filter( 'callbackbubble_show_widget', function( $show ) {
    if ( is_product( 123 ) ) { // Replace 123 with your product ID
        return false;
    }
    return $show;
});

JavaScript Events (Analytics)

The frontend script dispatches CustomEvents on document that you can use to integrate with Google Analytics, GTM, Meta Pixel, etc.

document.addEventListener('callbackbubble:request', function (e) {
    // Fired when a request is recorded (form submitted or external trigger clicked)
    // e.detail.timestamp
    if (typeof gtag === 'function') {
        gtag('event', 'callback_request');
    }
});

document.addEventListener('callbackbubble:popup_open', function (e) {
    // Fired when the internal popup is opened
    // e.detail.mode === 'internal'
});

Changelog

2.3.0

• New: Widget side configurable (left/right) with automatic bubble flip
• New: Dark mode based on system prefers-color-scheme
• New: Page/post exclusion by ID list
• New: JS analytics events (callbackbubble:request, callbackbubble:popup_open)
• A11y: Honors prefers-reduced-motion
• A11y: Focus trap inside the modal (Tab / Shift+Tab)
• A11y: Added aria-describedby to the dialog
• i18n: Drop zone label now translatable
• Security: Explicit output escaping on bubble texts and ARIA labels
• Refactor: Admin assets moved out of inline wp_add_inline_* into dedicated assets/admin.css and assets/admin.js (CSP friendly)
• Refactor: Removed redundant per-language hardcoded texts (now using only __() + .po files)
• Fix: callbackbubble_adjust_brightness() supports #fff shorthand and validates input
• Perf: Cached external popup trigger selector

2.2.0

• New Feature: Built-in internal popup with beautiful UI/UX
• Customizable popup with title, subtitle, background image
• Native support for WPForms, Contact Form 7 and other form plugins
• Privacy text display below the form
• Customizable button color
• Choose between internal popup or external trigger mode
• Glassmorphism design with backdrop blur effects
• Responsive design optimized for mobile
• Close popup with X button, ESC key, or click outside
• Accessibility improvements (ARIA, focus management)
• Performance: Defer script loading
• Bug fix: Color sanitization with fallbacks
• Bug fix: Dynamic bubble positioning based on widget size

2.1.0

• Added rate limiting feature to prevent spam requests
• Configurable max requests per time period
• Custom rate limit message
• Visual feedback when limit is reached

2.0.0

• Added WordPress admin settings page
• All parameters now customizable without code
• Improved JavaScript with better touch handling
• Dynamic CSS generation based on settings
• Added activation/uninstall hooks
• Better code organization and documentation
• Added plugin action links

1.1.0

• Initial release with filter-based customization

Requirements

• WordPress 5.0+
• PHP 7.4+

License

GPL v2 or later