WP Manifestindependent plugin directory
manifest / social / at-float-bar

AT-Float Bar

A beautiful floating contact bar for WordPress — WhatsApp, social, dark mode, mobile app nav bar. Zero dependencies.

by Altechmind Technologies · github.com/altechmind/at-float-bar · website

★ 0stars
0forks

Install

No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:

wp plugin install https://github.com/altechmind/at-float-bar/archive/refs/heads/main.zip
Readme github.com/altechmind/at-float-bar ↗

A beautiful, lightweight floating contact bar for WordPress.

WhatsApp · Phone · Email · Facebook · Instagram · LinkedIn · Twitter/X · Custom buttons
Dark mode · Mobile app-style bottom nav · Edge panel sidebar · Zero dependencies · GPL-2.0-or-later

Features

  • 9 button types — WhatsApp, Phone, Email, Facebook, Instagram, LinkedIn, Twitter/X, and 2 fully custom buttons
  • 5 desktop positions — Float Right, Float Left, Bottom Row, Edge Panel Right, Edge Panel Left
  • Mobile app bottom bar — Independent toggle: regardless of your desktop layout, enable a full-width iOS/Android-style tab bar on mobile & tablet (≤ 768 px)
  • Dark mode — Auto (follows OS), Always Light, Always Dark — affects edge panels and the mobile bottom bar surface
  • WhatsApp pulse animation — Attention-grabbing ring animation (fixed: entrance animation and pulse live on separate DOM elements, zero CSS conflict)
  • Per-button colour picker — Full hex colour control with live preview
  • Tooltips — Frosted-glass labels on hover, automatically positioned per layout
  • Entrance animation — Staggered slide-in on page load
  • Desktop redirect — WhatsApp opens web.whatsapp.com on non-touch, native app on mobile
  • Accessibility — ARIA labels, role="complementary", focus rings, prefers-reduced-motion support
  • Zero dependencies — No jQuery, no CDN, no external fonts, no tracking

Installation

From ZIP

  1. Download at-float-bar.zip
  2. In WordPress admin → Plugins → Add New → Upload Plugin
  3. Upload the ZIP, activate the plugin
  4. Go to Float Bar in the left menu

From Source (GitHub)

cd wp-content/plugins
git clone https://github.com/altechmind/at-float-bar.git

Activate in Plugins → Installed Plugins.

Usage

  1. Go to Float Bar in the WordPress admin sidebar
  2. Contact tab — Enable WhatsApp, Phone, and/or Email. Enter your details.
  3. Social tab — Enable Facebook, Instagram, LinkedIn, and/or Twitter/X. Paste your profile URLs.
  4. Custom tab — Add up to 2 custom buttons with any URL and icon.
  5. Appearance tab — Choose desktop position, dark mode, button style/size, offsets, and effects.
  6. Visibility tab — Enable the Mobile App Bottom Bar for a native-feeling tab bar on phones and tablets. Set page exclusions.
  7. Press Save Settings (or Ctrl+S).

Mobile App Bottom Bar — Design Tips

  • Works best with 3–5 buttons. With more than 5, icons become cramped.
  • Recommended: WhatsApp + Phone + 1–2 social links.
  • If your theme has content near the bottom edge, add ~80 px of bottom padding to avoid content being hidden behind the bar.

Screenshots

Desktop — Edge Panel Right Mobile — App Bottom Bar
Frosted glass sidebar flush to screen edge Full-width iOS/Android-style tab bar

File Structure

at-float-bar/
├── at-float-bar.php              # Plugin bootstrap, settings schema
├── uninstall.php                 # Clean DB removal on plugin delete
├── README.md                     # This file (GitHub display)
├── readme.txt                    # WordPress.org readme
├── LICENSES-THIRD-PARTY.txt     # Third-party attributions
├── includes/
│   ├── class-afb-core.php        # Frontend render, asset enqueue
│   └── class-afb-admin.php       # Admin panel, AJAX save, sanitisation
├── frontend/
│   ├── frontend-style.css        # Floating bar CSS, dark mode, animations
│   └── frontend-script.js        # Entrance anim, touch detection, WA redirect
└── admin/
    ├── admin-style.css           # Admin panel design
    └── admin-script.js           # Tabs, toggles, color sync, AJAX save

Security

  • Nonce verification — check_ajax_referer('afb_admin_nonce') on every AJAX save
  • Capability check — current_user_can('manage_options') before any write
  • Input sanitisation at save:
    • Colours: sanitize_hex_color() with safe fallback
    • WhatsApp number: preg_replace('/[^0-9]/', '') — digits only
    • Phone: sanitize_text_field()
    • Email: sanitize_email()
    • URLs: esc_url_raw()
    • Text fields: sanitize_text_field() / sanitize_textarea_field()
    • Enum fields (position, style, size, dark mode, icon): strict in_array() allowlist
    • Page IDs: absint() + range cap
  • Output escaping — Every rendered value uses esc_url(), esc_attr(), or esc_html()
  • CSS injection proof — Hex colours are re-validated with sanitize_hex_color() at render time
  • No SQL queries — Settings stored as a single serialised WP option, no custom tables
  • No external requests — All icons inline SVG, zero CDN, zero tracking

Requirements

Requirement Minimum
WordPress 5.8+
PHP 7.4+
Browser Any modern browser (Chrome, Firefox, Safari, Edge)

Settings Reference

Setting Default Description
enabled 1 Global on/off
position right Desktop position: right, left, bottom, edge-right, edge-left
mobile_bottom_bar 0 Override position on ≤768 px with app-style bottom bar
dark_mode auto Surface colour scheme: auto, light, dark
button_style circle Shape: circle, pill, square
button_size md Size: sm (42 px), md (52 px), lg (62 px)
wa_pulse 1 WhatsApp pulse ring animation
tooltip_enabled 1 Hover labels
entrance_anim 1 Slide-in animation on page load
hide_mobile 0 Hide on ≤768 px
hide_desktop 0 Hide on >768 px
excluded_pages '' Comma-separated post/page IDs

Changelog

1.2.2

  • New: Dark mode — Auto / Always Light / Always Dark
  • New: Mobile & tablet app-style bottom bar (independent of desktop position)
  • New: Admin info box with design tips and content-overlap warning for mobile bar
  • Fix: WhatsApp pulse animation no longer hides the icon (entrance animation moved to wrapper element, pulse stays on button — zero CSS conflict)
  • New: 4 social buttons — Facebook, Instagram, LinkedIn, Twitter/X with enable/disable toggle each
  • New: Edge Panel Right and Edge Panel Left positions (frosted glass sidebar flush to screen edge)

1.1.0

  • Added Facebook, Instagram, LinkedIn, Twitter/X social buttons
  • Added Edge Panel Right / Left positions
  • Bottom bar renders as app-style tab bar on mobile

1.0.0

  • Initial release: WhatsApp, Phone, Email, 2 custom buttons
  • Float right, float left, bottom row positions
  • Admin panel with tabs, AJAX save, colour pickers

License

GPL-2.0-or-later — https://www.gnu.org/licenses/gpl-2.0.html
Copyright (C) 2025-2026 Altechmind Technologies (OPC) Pvt. Ltd.

Author

Altechmind Technologies (OPC) Pvt. Ltd.
Specialising in OJS, DSpace, WordPress and web development for academic publishing.
www.altechmind.com · WordPress Services