WP Manifestindependent plugin directory
manifest / themes / incod-optimized-mobile-menu

inCOD Optimized Mobile Menu

Transform the standard WordPress mobile menu into a fully customizable overlay menu with advanced customization options. Perfect for creating a professional mobile experience.

by inCOD, ideagrafica · github.com/ideagrafica/incod-optimized-mobile-menu · 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/ideagrafica/incod-optimized-mobile-menu/archive/refs/heads/main.zip
Readme github.com/ideagrafica/incod-optimized-mobile-menu ↗

A free WordPress plugin that replaces the default mobile navigation with a fully customizable full-screen overlay menu — colours, icons and contact buttons are all configurable from the dashboard, with zero external requests.

Description

WordPress ships with a plain slide-in mobile menu that is hard to brand and impossible to style without touching theme code.

inCOD Optimized Mobile Menu renders a modern overlay menu instead: assign a menu to the Mobile Menu location (or drop the shortcode anywhere) and the plugin takes over the mobile navigation with your own colours, icon set and contact buttons.

Key Features

  • Overlay mobile menu – replaces the standard WP mobile menu when the assigned menu is selected in Appearance > Menus.
  • Contact buttons – configurable Info (URL) and Call (tel:) buttons with independent normal/hover colours.
  • Full colour control – menu background, link colours and hover state, hamburger and close icon colours.
  • Icon library choice – Font Awesome Free (bundled locally), Line Icons (inline SVG) or HTML symbols/entities for the submenu arrows.
  • Hamburger icon size – 12–96 px, the close icon scales with it; custom icon URL is supported.
  • Tabbed dashboard – Color Settings, Contact Settings, Icon Settings and Shortcode tabs with live preview of colours and icons.
  • Shortcode – [incod_mobile_menu] renders the overlay anywhere in your content.
  • No external requests – Font Awesome Free 6.5.2 is bundled in assets/fonts/fontawesome/; no CDN calls at all.
  • Translation ready – internationalized with a .pot template in languages/.

Security

  • check_admin_referer() nonce verification (incod_mobile_menu_save) on every save.
  • current_user_can( 'manage_options' ) capability check.
  • Input sanitisation: sanitize_hex_color(), esc_url_raw(), sanitize_text_field(), sanitize_key() and wp_kses() for inline SVG.
  • Post/Redirect/Get on save, settings merged with defaults, strict output escaping (esc_attr(), esc_url(), esc_html()).

Requirements

  • WordPress 5.7+
  • PHP 7.4+

Installation

  1. Upload the incod-optimized-mobile-menu folder to /wp-content/plugins/.
  2. Activate the plugin through the Plugins menu in WordPress.
  3. Go to Appearance > Menus, create or edit a menu and tick Mobile Menu (incod) in Menu Settings.
  4. Configure the overlay under Mobile Menu in the WordPress admin.
  5. Alternatively, insert [incod_mobile_menu] in any post, page or template.

Frequently Asked Questions

Does the plugin load Font Awesome from a CDN? No. Font Awesome Free 6.5.2 (CSS + woff2 fonts) is bundled inside the plugin, so there are no third-party requests.

How do I show the menu? Assign a menu to the Mobile Menu (incod) location — the overlay replaces the default mobile menu on the front-end, or use the [incod_mobile_menu] shortcode.

Can I use my own hamburger icon? Yes, paste a custom icon URL in the settings and choose its size (12–96 px).

Which submenu arrow icons are available? Font Awesome class names (bundled), Line Icons rendered as inline SVG (they inherit the link colour), or any symbol/HTML entity/inline SVG you type in.

Screenshots

  1. The overlay menu on a mobile device.
  2. Colour Settings tab with live preview.
  3. Contact Settings tab (Info and Call buttons).
  4. Icon Settings tab with the icon library selector.
  5. Shortcode tab.

Changelog

1.2.0

  • Settings dashboard split into 4 tabs: Color Settings, Contact Settings, Icon Settings, Shortcode.
  • Fix: close (X) icon was rendered as an invisible coloured square.
  • Fix: close icon colour now applies.
  • Fix: selected icon library is preserved when saving.
  • Fix: submenu arrows visible — Font Awesome bundled locally, Line Icons as inline SVG, HTML symbols respected.
  • Fix: uploaded hamburger icon URL is no longer dropped on save.
  • Add: hamburger icon size setting (12–96 px), close icon scales with it.
  • Add: live preview of colours and icons.
  • Add: Post/Redirect/Get on save, settings merge, input sanitisation.
  • Security: removed PHP from the admin JavaScript, whitelisted icon library, strict output escaping.
  • Add: .pot translation template, English source strings everywhere.

1.1.0

  • Settings panel with customisable colours, contact buttons and icons.
  • Hamburger and close icon colour options.

1.0.0

  • Initial release: mobile menu overlay, colour customization, contact buttons, icon library support.

License

GPLv2 or later — https://www.gnu.org/licenses/gpl-2.0.html