Mobile Panel Plugin

A WordPress plugin that provides a responsive panel with different behaviors on desktop and mobile devices.

Features

• Desktop: Displays a simple popup with a close icon at the bottom, featuring a round shape and shadow.
• Mobile: Slides up from the bottom with a background overlay, taking at least 60% of the screen height and full width. Includes a subtle elastic animation.
• Mobile Close Icon: Positioned at the top, outside the panel, with a shadow.
• Panel Structure: Divided into header, content, and footer areas, separated by thin borders, with demo content.
• Trigger: Floating button on pages where the shortcode is placed.
• Cross-Platform: Optimized for iOS and Android with touch slide sensitivity mimicking native app behavior.
• Styling: Uses Tailwind CSS CDN for responsive design.

Installation

1. Upload the mobile-panel folder to the /wp-content/plugins/ directory.
2. Activate the plugin through the 'Plugins' menu in WordPress.
3. Add the [mobile_panel] shortcode to any page or post where you want the panel trigger.

Usage

Simply add the shortcode [mobile_panel] to your content. A floating button will appear, allowing users to open the panel.

Requirements

• WordPress 5.0 or higher
• jQuery (included with WordPress)

Changelog

1.0.0

• Initial release with desktop popup and mobile slide-up panel.