How to Add Your Quiz to the WordPress Menu (So Mobile Visitors Find It)

You built a quiz, embedded it on a page and shared the link once. Now it sits two or three clicks deep, and on a phone almost nobody finds it. Mobile visitors look for things in one place: the menu behind the menu button. If your quiz isn’t in that menu, most of them will never know it exists.

This guide shows how to add a quiz to your WordPress menu with the tools already in WordPress, how to check that it shows up properly on a phone, how to keep a lead-generation quiz one tap away, and how to show member-only quizzes to logged-in users without cluttering the menu for everyone else.

Disclosure: Responsive Menu, which we mention in a few steps below, is made by ExpressTech, the same team that builds Quiz and Survey Master. We point to it only where WordPress doesn’t already do the job.

Before you start: give your quiz its own page

A menu links to a page, so the quiz needs a page of its own. If it’s currently tucked inside a long blog post, move it.

• Create a page and embed the quiz with the QSM block or its shortcode. Our guide to the different ways to embed a quiz covers each option.
• Give the page a short, specific title such as “Find your plan”, “Skin type quiz” or “Course final test”. This becomes the menu label, so it has to make sense on its own.
• Put the quiz near the top of the page. A visitor who taps a menu item called “Take the quiz” expects to see the first question, not three paragraphs of introduction.
• If the quiz is only for members, turn on Require user to be logged in in the quiz’s settings now. Step 4 explains why the menu alone isn’t enough.

Step 1: Add the quiz page to your menu

How you do this depends on whether your theme is a block theme (like Twenty Twenty-Five) or a classic theme. If you’re not sure, check Appearance in your dashboard: block themes show Editor, classic themes show Menus.

Block themes: the Navigation block

1. Go to Appearance → Editor → Navigation and open the menu used in your header.
2. Click the + inserter inside the menu and choose Page Link.
3. Search for your quiz page and select it.
4. Drag the new item to where you want it. Higher is better for anything you want people to take.
5. Save.

Classic themes: Appearance → Menus

1. Go to Appearance → Menus and select your main menu.
2. In the Pages box, tick your quiz page and click Add to Menu.
3. Open the new item and edit the Navigation Label if the page title is too long for a menu.
4. Drag it into position, then click Save Menu.
5. Under Menu Settings, check that the menu is assigned to your theme’s primary (and, if your theme has one, mobile) location.

A note on labels: use the words a visitor would use. “Take the quiz” or “Which plan fits you?” tells people what happens when they tap. “Assessment” or “Engage” doesn’t.

Step 2: Check that it works on a phone

Desktop menus and mobile menus are often two different things. An item that looks fine on a laptop can end up at the bottom of a long list, hidden inside a submenu, or missing on a phone.

If you use the Navigation block

Select the Navigation block in your header and look at the Overlay Menu setting. “Mobile” collapses the menu into a button on small screens, which is what most sites want. Since WordPress 7.0 you can also design that overlay yourself in the Site Editor.

Two things to check on a real phone:

• Position. In the built-in overlay, submenus are always shown fully expanded. A quiz nested under a parent item is still visible, but it can be pushed far down a long list. Keep it at the top level.
• Custom overlays. If you’ve customised the overlay, open it, tap every item and use the Tab key on a laptop with the window narrowed. Make sure nothing overlaps your quiz link.

If you use a classic theme

The mobile menu is whatever your theme ships with. Some are good, some are cramped, and some quietly drop items or use a tiny tap area. If yours makes the quiz hard to reach, a dedicated mobile menu plugin can replace it. This walkthrough on how to edit and fix a WordPress mobile menu covers the common problems.

A quick mobile checklist

• The quiz link is visible without scrolling once the menu is open.
• The label fits on one line.
• The link is easy to tap. At least 24×24 pixels is the WCAG minimum, and larger is more comfortable on a phone.
• The quiz page loads with the first question in view. Our guide to mobile-friendly quizzes covers layout and themes.

Step 3: Keep your lead-generation quiz one tap away

A menu link works for visitors who go looking. A lead-generation quiz also has to reach the people who never open the menu. For that, the quiz needs a link that stays on screen.

Option A: a button in your header (block themes)

In Appearance → Editor, open your Header template part and add a Buttons block next to the Navigation block, linking to the quiz page. To keep it visible while people scroll, select the header’s outermost Group block and, if your theme supports it, set Position to Sticky. Test it on a phone. A sticky header takes up space on a small screen, so keep it slim.

Option B: a header bar on mobile (Responsive Menu Pro)

If your theme doesn’t give you a clean way to do this on mobile, Responsive Menu Pro adds a header bar that stays fixed at the top of the screen. It can hold your logo, the menu button and your own HTML, so a “Take the quiz” link can sit beside the menu button on every page. It can also change colour as visitors scroll. The header bar is a Pro feature. Responsive Menu Pro plans start at $49 a year for one site, and every plan includes every Pro feature.

Whichever you choose

• Use one persistent call to action. A sticky bar, a floating button and a pop-up all asking for the same quiz is too much.
• Make the label about the result the visitor gets: “Get your score”, “Find your match”.
• Send the button to the quiz itself, not a page that describes the quiz.

For the quiz side of this, see how to create a lead-generation quiz in WordPress.

Step 4: Show member quizzes only to logged-in users

Course tests, staff assessments and member-only surveys shouldn’t sit in the menu for every visitor. Guests can’t take them, and a menu item that leads to a login wall is a dead end. Logged-in members, on the other hand, should find them straight away.

WordPress menus don’t have a logged-in or logged-out setting. You can build separate menus and switch between them in theme code, or use a plugin that adds visibility options to each menu item.

With Responsive Menu (free)

The free Responsive Menu plugin on WordPress.org adds three options to every item in Appearance → Menus, under “RMP Settings”:

• Hide for logged in users. Use this for a “Log in to take your course quiz” item that only guests should see.
• Hide for non logged in users. Use this for the “My quizzes” or “Course final test” item itself.
• Show only to these roles. Use this for quizzes meant for one group, such as a staff assessment visible only to Editors, or a quiz for a membership level that has its own role.

If you hide a parent item, its sub-items are hidden too, so you can group several member quizzes under one “Members” item and control them all at once. These settings apply to classic menus built in Appearance → Menus, including the one Responsive Menu shows as your mobile menu.

Hiding the link doesn’t lock the quiz

Anyone with the URL can still open a page whose menu link is hidden. Hiding the link keeps the menu tidy. The protection comes from QSM: turn on Require user to be logged in for the quiz, and guests will see your login message instead of the questions. Our guide to creating a quiz for logged-in users walks through the settings.

Which tool for which job

• WordPress on its own is enough to put a quiz page in your menu, collapse the menu on phones and, on block themes, add a sticky header button.
• Responsive Menu (free) helps when your theme’s mobile menu is the problem, when you want to design the mobile menu visually, or when you need items for logged-in users, guests or specific roles.
• Responsive Menu Pro adds the fixed mobile header bar for a persistent quiz link, plus desktop and mega menus.

If you’re weighing other options too, this comparison of free WordPress menu plugins covers the main alternatives and what each is good at.

Frequently asked questions

How do I add a quiz to my WordPress menu?

Embed the quiz on its own page, then add that page to your menu. On a block theme, go to Appearance → Editor → Navigation and add a Page Link. On a classic theme, go to Appearance → Menus, tick the page in the Pages box, click Add to Menu and save.

Why doesn’t my quiz show up in the mobile menu?

Your theme may use a separate menu location for mobile, or nest the item somewhere hard to reach. Check which menu is assigned to each location in Appearance → Menus, or check the Navigation block’s Overlay Menu setting on a block theme. Then test on a real phone.

Can I show a quiz in the menu only to logged-in users?

Not with WordPress alone. The free Responsive Menu plugin adds “Hide for logged in users”, “Hide for non logged in users” and role options to each menu item. To stop guests from taking the quiz, also turn on QSM’s Require user to be logged in setting, because hiding a link doesn’t protect the page.

Should I put my quiz in the menu or in a header button?

Both, if it’s a lead-generation quiz. The menu item helps visitors who look for it, and a header button reaches visitors who never open the menu. For member-only quizzes, the menu item on its own is usually enough.

Next step

Pick the one quiz you most want people to take, give it its own page and add it to your menu today. Then open your site on your phone and tap through it the way a visitor would. If you haven’t built that quiz yet, download Quiz and Survey Master for free and start with a template.