Skip to content

How to show a quiz in a popup in WordPress

Show a WordPress quiz popup or slide-in with Quizably shortcodes. See when a popup helps, when it annoys, and how to keep it fair for visitors.

By . 8 min read. , .

A WordPress quiz popup opens your quiz in a window over the page instead of placing it in the content. With Quizably, you add the shortcode [quizably_quiz_popup id="..."] where you want it, and the quiz opens as a popup. There is also a slide-in version: a button in a bottom corner that opens the quiz in a small panel.

The harder question is whether you should. Popups can get attention, and they can also annoy people enough to leave. This guide shows how to set it up, then spends most of its time on when a popup helps, when it hurts, and how to do it fairly.

Two shortcodes for a WordPress quiz popup

Quizably gives you two ways to show a quiz outside the normal page flow:

  • Popup: [quizably_quiz_popup id="..."] opens the quiz in a modal window.
  • Slide-in: [quizably_quiz_slidein id="..."] opens the quiz in a small panel from a button in a bottom corner.

Both take the id of your quiz (the number or the UUID), the same way the regular embed does. The Summary tab has copy buttons for each shortcode. If you have not placed a quiz on a page before, read how to add a quiz to a WordPress page first, because the same rules apply: publish the quiz, use the right id, and put the shortcode somewhere that processes shortcodes.

Which one to choose? A popup is a stronger interruption. It takes over the screen until the visitor finishes or closes it. A slide-in is quieter and lets people keep reading. If you are unsure, start with the slide-in.

How to add it to a page

The shortcode output is what you place on the page. The steps are:

  1. Publish your quiz in Quiz Builder.
  2. Open the page or post where the quiz should be offered.
  3. Add a Shortcode block, or a shortcode element in your page builder, and paste the popup or slide-in shortcode.
  4. Update the page and view it on the front end.

Each shortcode prints a button (default label “Take the quiz” for the popup, “Take quiz” for the slide-in, changeable with label). By default the quiz opens when the visitor clicks it. You can also open it automatically with the trigger attribute:

  • trigger="delay" with delay="10" opens it after 10 seconds.
  • trigger="scroll" with scroll="60" opens it once 60 percent of the page is scrolled.
  • trigger="exit" opens it when the mouse leaves through the top of the window. It never fires on touch devices.
  • once controls how often it opens by itself: session (the default), day or always. The button always works either way.

The slide-in also takes position="bottom-left" or bottom-right. The popup closes with the x, a click outside or Esc, and the slide-in is not modal, so the page still scrolls behind it. The details are in the popup and slide-in docs.

Whatever you do, open the page yourself after you publish it, click through it on desktop and phone, and see exactly what a visitor sees.

When a popup helps

A popup is a good fit when the visitor has asked for it or is very likely to want it.

A clear call to action. A page says “Take the 2-minute quiz to find your plan”, with a button, and the quiz opens when they click. That is a visitor choosing to start. It keeps them on the page they were reading and avoids a page load.

A focused moment. A popup gives the quiz the whole screen, so nothing else competes for attention. For a short quiz on a busy page, that focus can help.

A placement you cannot fit inline. Sometimes a page layout has no good room for a full quiz. A popup or slide-in lets you offer it without redesigning the page.

Promotions and campaigns. If you are sending traffic from an email or an ad to a landing page, offering the quiz as a popup can suit that page, as long as the visitor understands why it appears.

When a popup hurts

Be honest with yourself about this part.

It appears before the visitor has done anything. Someone lands on a page, wants to read, and a window covers the text. Many people close it without reading, and some leave the site. A quiz is not a tiny ask, so a surprise is especially costly.

It is hard to close. If the close button is small, low contrast or missing on a phone, you have trapped the visitor. That is a bad experience and a bad look for your brand.

It fires on every page. A returning visitor who sees it each time gets irritated quickly. Show it where it is relevant, not everywhere.

It covers the content on mobile. Phone screens are small. A popup can cover nearly everything, and an intrusive one may also be treated badly by search engines. Google has published guidance about intrusive interstitials on mobile, so check the current wording before you add anything that blocks content on phones.

The quiz is long. A popup feels like a quick thing. If your quiz takes several minutes, people opened it expecting less. Set expectations in the invitation: “7 questions, about 2 minutes”.

My opinion: use an inline quiz as your default, and treat a popup as an extra for pages where it fits. Inline quizzes cannot be dismissed by accident, do not block the page, and are friendlier to screen readers and phones.

FormatInterrupts?Good forWatch out for
Inline in the pageNoMost quizzes, most pagesIt can be scrolled past
Slide-inA littleOffers beside content people are readingCovering content on small screens
PopupYesVisitor-triggered starts, focused momentsAnnoyance, mobile blocking

Be fair to your visitors

A few habits keep a popup on the right side of the line.

  • Let people say no, easily. The close control should be obvious and big enough to tap.
  • Do not fire it immediately. Give people a moment with the page before offering anything. A delay or scroll trigger does this, and once="session" stops it repeating.
  • Do not hide the price of the ask. Say what the quiz is, how long it takes, and whether it asks for an email. If it does, put the form where it makes sense and say what you will do with the address.
  • Do not show it again and again. The once setting limits automatic opens to once per session or per day.
  • Write a useful invitation. “Find the right routine in 2 minutes” beats “Take our quiz”.

Accessibility

Anyone who uses a keyboard or a screen reader deserves to use your quiz too. A popup adds a few risks, so check these on your own site:

  • Can you open and close it with the keyboard alone? The popup traps focus while open and Esc closes it.
  • Does focus move sensibly when it opens, and return to the page when it closes?
  • Is the text readable, with enough contrast against the background?
  • Can you finish the quiz on a phone without zooming or scrolling sideways?
  • If you use a custom background image, is the text still easy to read over it?

Themes can still interfere with a popup, so test it with the keyboard and on a small screen. If any of those checks fail and you cannot fix them, use the inline version instead.

How to measure whether it works

A popup is a hypothesis: “people will start more often this way”. Test it.

  1. Start with the quiz analytics. Quizably shows submission count, completion rate and per-question drop-off for each quiz. Read completion rate with care. It counts only people who began the quiz, so a popup that few visitors open can still show a healthy rate. Each page load adds a view even if nobody opens it, and that view count is in the analytics CSV, not the admin screens. Compare the rate to its own baseline, and watch drop-off after the first question.
  2. Compare formats. Show the quiz inline on one page and as a popup or slide-in on another of similar traffic, for the same period. Change one thing at a time, and compare finished quizzes and leads rather than completion rate alone, for the reason above.
  3. Watch the page, not only the quiz. Your site analytics can show whether visitors leave a page faster after you add a popup. A rise in quick exits is a warning sign.
  4. Count leads per visitor, not just per quiz start. A popup that lifts starts but hurts the rest of the page may not be a win.

For what each number means, quiz metrics worth tracking goes through them. If a popup feels too pushy for your readers, a quiz in the sidebar is a quieter option. If completion is low for the quiz itself, ways to improve your quiz completion rate will help more than a new format.

A simple setup to start with

  • Build a short quiz of about five questions.
  • Place the slide-in or popup shortcode on one relevant page, such as a post on the same topic.
  • Open it yourself on desktop and phone. Close it, reload, and check it behaves as you expect.
  • Run it for a couple of weeks and compare it with an inline version.
  • Keep it only if it adds starts without hurting the page.

Next step

Pick one page where a quiz would genuinely help the reader, and place the popup or slide-in shortcode there. Test it on a phone, then compare it with an inline embed after a couple of weeks. If you have not built the quiz yet, start with how to create a quiz in WordPress. If you’re comparing plugins, popup support is one of the embedding checks in the WordPress quiz plugin buyer’s guide. For how a popup quiz fits into a wider plan, see the quiz marketing guide.

Frequently asked questions

What is the shortcode for a quiz popup?

Use [quizably_quiz_popup id="..."] with your quiz's number or UUID. It shows a button that opens the quiz in a popup window instead of placing it in the page content.

What is the difference between the popup and the slide-in?

The popup opens the quiz as a modal over the page. The slide-in, [quizably_quiz_slidein id="..."], shows a button in a bottom corner that opens the quiz in a small panel. It is not modal, so it is less blocking.

Do popups hurt the visitor experience?

They can. A popup that appears the instant a page loads, or that is hard to close, annoys people and can push them away. A popup that opens because the visitor asked for it is usually fine.

Should I use a popup on mobile?

Be careful. Screens are small, popups can cover most of the page, and search engines may treat intrusive popups on mobile badly. Test on a real phone and consider an inline quiz instead.

How do I know if the popup is working?

Check the quiz analytics for starts, completion rate and drop-off, then compare against the same quiz placed inline. Keep in mind that a submission only starts when a visitor opens the popup and begins, so the completion rate tells you how many of those people finished, not how many page visitors opened it. Your own page analytics can show how visitors behave around it.

Keep reading