Blocksy Mobile Menu Not Working: Trace the Tap From Trigger to Panel

Dead taps, empty drawers and a menu of every page

Write down exactly what happens before you change a setting. Each failure below points at a different layer of Blocksy, and owners who skip this step tend to fix the wrong one. Test on a real phone, logged out, in a private window, because a logged-in administrator often bypasses the page cache and the optimizer that visitors get.

• The tap does nothing at all. The Trigger button is drawn but no script is listening to it. Start with the optimizer suspects below.
• It opens on the second or third tap. Scripts are being held back until the first interaction, so the first tap only wakes them up.
• The drawer slides in empty. The panel exists, but the Mobile Menu element is missing from it.
• The drawer lists every page on the site. No menu is assigned to Blocksy's Mobile Menu location, so the theme falls back to a list of all published pages.
• Phones work, tablets show no hamburger. The Trigger's visibility is switched off for tablet, or the tablet is wide enough to get the desktop header.
• A dark overlay appears with no menu on it. The panel opened, but the styles for its open state were stripped or never loaded.

What happens between the tap and the slide-in on Blocksy

Blocksy builds its header in Customizer > Header, with a device switch that flips the builder between the desktop layout and the mobile layout. The mobile layout has the usual Top Row, Main Row and Bottom Row, plus an Offcanvas area. The hamburger is the Trigger element, usually in the Main Row. Whatever you drop into the Offcanvas area, normally the Mobile Menu element, is what the drawer shows. The drawer's own options, such as Reveal as (Side Panel or Modal) and Reveal From left or right, live in the Offcanvas settings.

Two details from the theme's 2.1.58 source explain most failures. First, Blocksy only prints the off-canvas panel into the page when the header layout contains a Trigger; inside the Customizer preview it prints it anyway, which is why a menu can work while you design and vanish on the live site. Second, the Trigger is a plain button. The click handler comes from the theme's main.js, loaded in the footer, and the code that animates the panel arrives as small numbered files from the theme's static/bundle folder, fetched on demand using an address the page carries in an inline data script. Break any link in that chain and the button stays a picture of a button.

Five suspects on a Blocksy site, most likely first

1. An optimizer is holding main.js hostage

Delay JavaScript until interaction, combine scripts, and move inline scripts to the footer are the three settings we switch off first. Delay produces the second-tap symptom. Combining can reorder the inline data script so main.js cannot find the address for its panel files. Check by opening the page with the optimizer's bypass parameter or with the plugin paused, then watch the browser console for an error about loading a chunk. CreativeThemes' own documentation warns that aggressive CSS or JavaScript processing can interfere with dynamic theme features, and our Blocksy speed guide covers which switches are worth keeping.

2. The Trigger or the Mobile Menu left the mobile layout

Open the header builder, switch to the mobile view and look. A Trigger deleted during a redesign means no panel is printed at all. A Mobile Menu element dragged out of the Offcanvas area gives you the empty drawer. Click the Trigger and check Element Visibility: if Tablet is off, every screen from 690 to 999 pixels gets a header with no way in.

3. The Mobile Menu location has no menu

Blocksy registers four menu locations: Header Menu 1, Header Menu 2, Mobile Menu and Footer Menu. The Mobile Menu element's Select Menu option defaults to that location. Leave the location empty and the theme lists every published page instead. Point Select Menu at a menu you later deleted and it quietly falls back to the location. Check under Appearance > Menus > Manage Locations.

4. A cache is serving yesterday's header

Header changes are HTML. If the page cache or a CDN kept the old markup, visitors get the old Trigger, or none, until it is purged. Compare the page source logged out with what you see logged in. If they differ, purge, and read Blocksy CSS not updating for the full cache order.

5. Somebody else's header is on the page

Pro's conditional headers can show a different header on the shop or the blog, and that header may have no Trigger. A page builder's theme template can replace Blocksy's header entirely. View source and search for ct-header-trigger. If it is not there, the menu you are debugging is not Blocksy's, and the generic mobile menu guide is the better map.

Repair the Blocksy hamburger without guessing

1. 1

   Reproduce it as a visitor

   Use a real phone or a private window at 375 pixels wide, logged out. Note which of the six symptoms you see and on which templates.

2. 2

   Pause every optimizer

   Turn off JavaScript delay, script combining and unused CSS removal, or pause the plugin, then purge its cache. If the menu works now, turn options back on one at a time and exclude the theme's main.js from delay.

3. 3

   Read the console

   Reload with developer tools open. An error about a failed chunk, or a reference error naming ct_localizations, confirms that the theme's scripts are being moved or blocked. Our theme JavaScript errors guide explains how to read the rest.

4. 4

   Rebuild the mobile layout

   In Customizer > Header, switch to mobile. Make sure a Trigger sits in a visible row, the Mobile Menu element sits in the Offcanvas area, and both are visible on Tablet and Mobile. Publish.

5. 5

   Assign the menu

   Under Appearance > Menus > Manage Locations, give Mobile Menu a real menu, or set the element's Select Menu to a specific menu that exists.

6. 6

   Check conditional headers

   If you run Pro, open each conditional header and repeat the mobile layout check. A shop header without a Trigger is a common leftover.

7. 7

   Purge caches and retest

   Clear the page cache, the CDN and the optimizer's files, then test the tap on two phones and one tablet upright and sideways.

The fixed 1000 and 690 pixel lines, and the iPad problem

Blocksy's front-end CSS hard-codes its breakpoints. The mobile header takes over at 999.98 pixels and below, and the phone rules start at 689.98 pixels. We found no setting for either in the free theme or the vendor's documentation. The 2.1.56 changelog notes that the Customizer's responsive preview was changed to match the theme breakpoints, which tells you the numbers are part of the design rather than an option waiting to be found.

The practical result: an iPad held sideways at 1024 pixels gets the desktop header, not the hamburger. If your desktop menu is long, Blocksy folds the items that do not fit into an overflow dropdown, which is clever until a custom CSS rule confuses its measurements. Shorten the desktop menu, or test that dropdown on a tablet. Moving the breakpoint means custom CSS that overrides the theme's media queries, and that is fragile across updates. If your audience lives on tablets, the responsive layout guide explains the trade-offs.

Keep the drawer opening after the next update

Most Blocksy menu failures arrive with a change somebody made elsewhere: a new optimizer setting, a redesign of the header, an update to Companion without the theme. A short routine prevents nearly all of them.

• Exclude main.js from JavaScript delay permanently, and write the exclusion down where the next person will find it.
• Before redesigning the header, use Customizer > General Options > Manage Options to export your settings. It needs the Companion plugin.
• Update the theme, Companion and Pro together, on staging. A version mismatch switches Companion features off; Blocksy update broke my site explains the check.
• After every header change, tap the hamburger on a phone before you close the laptop.
• On stores, open the drawer on a product page too. Shop pages often run a different conditional header, and Blocksy WooCommerce layout problems tend to arrive at the same time.

If you would rather not own this checklist, our hosting and maintenance plans run updates on staging and test the menu, the cart and the forms before anything goes live.

A menu that keeps breaking is a stack talking

The Blocksy menu itself is well built. It keeps failing because four parties have opinions about it: the theme that draws it, the Companion plugin that holds half its features, the optimizer that rewrites its scripts, and the cache that remembers last week's header. Each one updates on its own schedule. A fix today is a truce, not a treaty.

The hamburger is the most tapped button on a phone, and on WordPress it has four landlords.

A Next.js site ships the menu as part of one tested build. There is no optimizer rewriting it after deploy and no plugin that can switch half of it off. That costs more up front and needs a developer for layout changes, so it is not the answer for every brochure site. The honest comparison is in Blocksy vs Next.js, the move is mapped in Blocksy to Next.js, and Athena CMS keeps the editing simple afterward. For how tap response is measured, see WordPress vs Next.js on INP.

Not ready for that conversation? Our theme troubleshooting service finds the failing layer on a copy of your site, and theme repair fixes it with a written record of every setting touched. More Blocksy and other theme fixes live in the troubleshooting section.