Title: DS Mobile Menu – Customizable Bottom Navigation Bar Author: DevStack IT Solutions Published: August 6, 2026 Last modified: August 6, 2026 --- Search plugins ![](https://ps.w.org/devstack-mobile-menu/assets/banner-772x250.png?rev=3636773) ![](https://ps.w.org/devstack-mobile-menu/assets/icon-256x256.png?rev=3636773) # DS Mobile Menu – Customizable Bottom Navigation Bar By [DevStack IT Solutions](https://profiles.wordpress.org/devstackit/) [Download](https://downloads.wordpress.org/plugin/devstack-mobile-menu.1.1.0.zip) * [Details](https://wordpress.org/plugins/devstack-mobile-menu/#description) * [Reviews](https://wordpress.org/plugins/devstack-mobile-menu/#reviews) * [Installation](https://wordpress.org/plugins/devstack-mobile-menu/#installation) * [Development](https://wordpress.org/plugins/devstack-mobile-menu/#developers) [Support](https://wordpress.org/support/plugin/devstack-mobile-menu/) ## Description **DS Mobile Menu** adds a beautiful, fully customizable bottom navigation bar to any WordPress website. Inspired by native mobile apps, it transforms the browsing experience on smartphones and tablets with smooth animations, six premium layout presets, and deep WooCommerce integration. ### Why DS Mobile Menu? Most mobile menus just style the hamburger. DS Mobile Menu replaces it with a native- app-style bottom navigation bar that visitors actually love to use. ### 6 Premium Layout Presets * **Minimal** — Clean, flat bar. Pure simplicity, zero distraction. * **Modern** — Card-elevated bar with a smooth active indicator line. * **Glassmorphism** — Frosted glass with backdrop blur and transparency. * **Floating** — Pill-shaped bar that hovers above the viewport edge. * **Center FAB** — Standard bar with an oversized center action button. * **Premium App** — Native-app feel with animated active state and notch support. ### Unlimited Menu Builder Build any navigation you need: * Unlimited menu items with drag-and-drop sorting* Custom icons (Dashicons, Font Awesome optional, or inline SVG) * Custom URLs, Page links, Post links, Category links, External links * Phone & Email links * Custom badges, tooltips, and labels * Hide labels, control icon size, font size, padding, border radius * Per-item animations (bounce, pulse, shake, scale) ### Deep WooCommerce Integration Automatically detects WooCommerce and supports: * Home, Shop, Categories, Wishlist, Cart, Checkout, My Account * Live cart badge counter via WC fragments (no page reload)* Badge auto-hides when cart is empty ### Full Visibility Controls Show or hide the menu based on: * Device (desktop, tablet, mobile — CSS breakpoints, no UA sniffing) * Login state (logged in / logged out) * User roles * Specific pages* 404, Search, Archive pages * WooCommerce pages ### Professional Customizer * Unlimited colors with live preview * Typography (font family, size, weight) * Glass effect with blur control * Gradients, borders, shadows * Safe area support (iPhone notch / home indicator) * Dark mode (respects `prefers-color-scheme`) * Transition duration and easing ### Performance First * No jQuery dependency on front-end — pure vanilla JS * Deferred script loading * Conditional asset loading — CSS/JS only on pages where the menu renders * Generated CSS written to a static file — served as a static asset, not generated on each request * No render-blocking resources * Core Web Vitals friendly ### Accessibility (WCAG AA) * Full keyboard navigation * ARIA labels and `aria-current="page"` on active items * Screen reader friendly with sr-only labels * Visible focus states * Contrast compliant ### Security * Nonce verification on all AJAX requests * Capability checks (`manage_options`) on all admin actions * Full input sanitization and output escaping * No direct database writes from raw user input * Proper Settings API usage ### Import / Export Backup and transfer all settings between sites with one click. Useful for staging- to-production deployments. ### RTL Support Full right-to-left layout support for Arabic, Hebrew, and other RTL languages. ### Translation Ready 100% internationalized. All strings use proper text domains and escaping translation functions. Includes a .pot template. ## Screenshots [⌊Bottom navigation bar — Modern layout on mobile⌉⌊Bottom navigation bar — Modern layout on mobile⌉[ Bottom navigation bar — Modern layout on mobile [⌊Six premium layout presets⌉⌊Six premium layout presets⌉[ Six premium layout presets [⌊Menu Builder — drag-and-drop interface⌉⌊Menu Builder — drag-and-drop interface⌉[ Menu Builder — drag-and-drop interface [⌊Appearance/Customizer panel⌉⌊Appearance/Customizer panel⌉[ Appearance/Customizer panel [⌊Layout Picker with visual previews⌉⌊Layout Picker with visual previews⌉[ Layout Picker with visual previews ## Installation 1. Upload the `devstack-mobile-menu` folder to `/wp-content/plugins/`. 2. Activate the plugin through the **Plugins** screen in WordPress. 3. Go to **DS Mobile Menu > Menu Builder** to add your navigation items. 4. Go to **DS Mobile Menu > Layouts** to choose your preferred style. 5. Go to **DS Mobile Menu > Appearance** to customize colors and typography. 6. Visit your site on mobile to see the navigation bar in action. ## FAQ ### Does it work with any WordPress theme? Yes. DS Mobile Menu works with any WordPress theme — classic themes, block themes, Elementor, Bricks, Breakdance, Divi, Avada, and more. ### Does it require WooCommerce? No. DS Mobile Menu works on any WordPress site. WooCommerce integration (cart badge, shop links) is automatically enabled when WooCommerce is detected. ### Will it slow down my site? No. DS Mobile Menu is built performance-first. It uses no jQuery on the front-end, loads deferred scripts, and only enqueues assets on pages where the menu renders. Generated CSS is served as a static file. ### Can I use my own SVG icons? Yes. In the Menu Builder, select “Custom SVG” as the icon type and paste your SVG markup. It is sanitized with `wp_kses` for security. ### How do I hide the menu on the desktop? Go to **DS Mobile Menu > Visibility**. The “Hide on Desktop” option is enabled by default at a 1024px breakpoint. You can adjust the breakpoint value. ### Can I export my settings and import them on another site? Yes. Go to **DS Mobile Menu > Import & Export** to download a JSON backup of all settings and import it on any other installation. ### Is Font Awesome included? Font Awesome is optional and self-hosted. Enable it in **DS Mobile Menu > Dashboard > General Settings** if you want FA icons. By default the plugin uses Dashicons ( bundled in WordPress core) and inline SVG. ## Reviews There are no reviews for this plugin. ## Contributors & Developers “DS Mobile Menu – Customizable Bottom Navigation Bar” is open source software. The following people have contributed to this plugin. Contributors * [ DevStack IT Solutions ](https://profiles.wordpress.org/devstackit/) * [ Emamul Islam Rabbi ](https://profiles.wordpress.org/webexpertrabbi/) [Translate “DS Mobile Menu – Customizable Bottom Navigation Bar” into your language.](https://translate.wordpress.org/projects/wp-plugins/devstack-mobile-menu) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/devstack-mobile-menu/), check out the [SVN repository](https://plugins.svn.wordpress.org/devstack-mobile-menu/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/devstack-mobile-menu/) by [RSS](https://plugins.trac.wordpress.org/log/devstack-mobile-menu/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 1.1.0 * Enhance: Automatically hide the navigation bar when the virtual keyboard is open on mobile devices to prevent overlapping input fields. * Fix: Resolved an issue where the center-fab layout button misaligned on iOS devices due to safe-area-inset scaling. * Fix: Set maximum z-index to prevent the navigation bar from being overlapped by checkout fields in some themes. * Security: Implemented strict sanitization and validation across all AJAX handlers and options processing. #### 1.0.0 * Initial release. * Six premium layout presets: Minimal, Modern, Glassmorphism, Floating, Center FAB, Premium App. * Unlimited menu builder with drag-and-drop sorting. * WooCommerce integration with live cart badge. * Full visibility controls. * Appearance customizer with dark mode support. * Import/Export settings. * RTL support. * WCAG AA accessibility. ## Meta * Version **1.1.0** * Last updated **2 days ago** * Active installations **Fewer than 10** * WordPress version ** 6.5 or higher ** * Tested up to **7.0.3** * PHP version ** 8.0 or higher ** * Tags * [bottom navigation](https://wordpress.org/plugins/tags/bottom-navigation/)[mobile menu](https://wordpress.org/plugins/tags/mobile-menu/) [mobile navigation](https://wordpress.org/plugins/tags/mobile-navigation/)[woocommerce](https://wordpress.org/plugins/tags/woocommerce/) * [Advanced View](https://wordpress.org/plugins/devstack-mobile-menu/advanced/) ## Ratings No reviews have been submitted yet. [Your review](https://wordpress.org/support/plugin/devstack-mobile-menu/reviews/#new-post) [See all reviews](https://wordpress.org/support/plugin/devstack-mobile-menu/reviews/) ## Contributors * [ DevStack IT Solutions ](https://profiles.wordpress.org/devstackit/) * [ Emamul Islam Rabbi ](https://profiles.wordpress.org/webexpertrabbi/) ## Support Got something to say? Need help? [View support forum](https://wordpress.org/support/plugin/devstack-mobile-menu/)