How to Embed a Quiz on a Page: Systeme.io, GoHighLevel, WordPress, Step by Step

A link is one more click. In a blog post or on a sales page, every click you ask for is a chance to leave before the first question.

An embedded quiz is already there: people read your page, see the first question and answer. They stay on your address, in your layout, in the middle of your content.

There's nothing to code. Tiquiz hands you the code ready to use, and your job comes down to a copy and paste in the right place. This article follows the video tutorial step by step, with what the code does and what can go wrong.

• A quiz or a survey that is Live. At the top of the editor, the switch reads Draft or Live. In draft, nobody can answer it, on your page or through the link.
• A link you're happy with. In the Share tab, under Custom link, you choose the end of the address, and your domain if you connected one (the walkthrough is in the custom domain article). The embed code contains that address: set it first, copy the code after.
• A page that accepts HTML code, and access to its editor: a Systeme.io page or blog post, a GoHighLevel page, a WordPress page or post.

1. Open your quiz, then the Share tab.
2. In the Custom link card, below your quiz link, find the Embed code area.
3. Click Copy. The button reads Copied: the whole code is on your clipboard.

For a survey, it's the same Share tab: the code sits below the link, with its Copy button.

The code comes in two parts, and you paste both together, as one block:

• An iframe: the frame that displays your quiz inside your page. It takes the full width of the spot you put it in, up to 640 pixels, and centers itself.
• A small script: a few lines that let your page and the quiz talk to each other.

That conversation handles three things for you:

• The height follows the content. The frame grows or shrinks with each screen (intro, question, form, result). No double scrollbar, no large gap under a short question.
• The page comes back to the top of the quiz. When someone moves to the next screen and the top of the quiz is out of view, the page brings it back, right below your menu if it stays stuck to the top of the screen. On load, nothing moves: your page is never scrolled before the person has touched the quiz.
• Each code looks after its own quiz. The script only listens to the frame it comes with: two different quizzes pasted on the same page don't get in each other's way.

On the stats side, nothing changes: someone who answers on your page counts as one visit, just like through the direct link. Their answers, their result and their contact details land in the same place in Tiquiz, with the same tags and the same follow-up emails.

The idea is the same everywhere: add an HTML code block where the quiz should appear, paste the whole code into it, save. Only the name of the block changes from one tool to the next.

In the editor of a page or a blog post, add the HTML code block (it's called Raw HTML) where you want the quiz, paste the code, then save.

In the page builder, add the custom code element, named Custom JS/HTML (or Custom Code, depending on the builder version), paste the code, then save.

In the block editor, add a Custom HTML block, paste the code, then update the page. If you use a page builder, look for its HTML code module: the move is the same.

Any tool that accepts an HTML code block will do. If yours has none, keep the link: a button that leads to your quiz does the job, and the Share tab also gives you a QR code.

A page editor's preview doesn't always run the code. The real test happens on the published page, opened the way a visitor would:

1. The quiz shows, at the right width.
2. You answer a question: the frame changes height with the screen.
3. You go all the way to the result: the page brings you back to the top of the quiz, and its title isn't hidden under your menu.
4. You run through it again on your phone.

The button on your result page opens in a new tab: people reach your offer without being stuck inside the frame.

• Pasting the link instead of the code. The quiz link stays a link to click. To show the quiz inside the page, you need the Embed code, and it goes into an HTML code block, not a text block.
• An editor that strips the script. Some tools, or some security settings, remove script tags when you save. The quiz stays visible and people can answer it, but the frame keeps its starting height (640 pixels): a longer screen scrolls inside the frame, and the page no longer comes back up on its own. First check that the code is in your tool's HTML code block, and complete.
• A quiz still in draft. The code can be copied even in draft, and Tiquiz warns you below the link: "This link only works once the quiz is live." Flip the switch to Live, at the top of the editor, before you publish your page.
• A column that's too narrow. The quiz takes the width of the spot you paste it in. In a sidebar or a multi-column layout it gets narrow, and the answers are hard to read. Give it a section that spans the full content width: beyond 640 pixels, it keeps that width and centers itself.
• Changing the link after pasting the code. The code contains the quiz address. If you later change the link or the domain, the code shown in the Share tab changes too: copy it again and replace the old one on your page.
• Pasting only half of the code. The iframe alone displays the quiz, without the height adjustment. Always use the Copy button instead of selecting with the mouse.