Embed your Q
Add your Q to any website by copying and pasting the embed code. The embed code is a short snippet of JavaScript and CSS that loads your Q in an iframe and resizes it automatically on desktops, tablets, and phones. It works in any tool that lets you paste raw HTML, from WordPress and Wix to TYPO 3 and page builders with an HTML element.
Copy and paste the embed code
- Go to PUBLISH and click on Embed/Landing page.
- Click on GET THE CODE.
- In the pop-up screen, click on COPY.
- Go to your website's text editor, and paste your Q's embed code.
Good to know before you start: your Q has to be published before it loads on your site.
Where to paste the embed code
The embed code is the same everywhere, but some platforms need a specific block or element to accept it.
| Platform | What to use | Guide |
|---|---|---|
| Wix | An Embed a widget / HTML iframe element | Embed a Q on Wix |
| TYPO 3 | An HTML content element | Embed a Q on Typo 3 |
| WordPress and other page builders | A Custom HTML or raw HTML element | This article |
| Any other site or CMS | Any field that accepts raw HTML | This article |
Always paste the embed code as raw HTML rather than into a rich text editor. If your website builder strips JavaScript, generate a No JavaScript embed under ADVANCED instead. It works almost everywhere, but your Q no longer resizes itself, so you have to set a fixed height. See Embed advanced for the full list of embed options such as max width, lazy loading, and SEO indexing.
Keep an embedded Q up to date
- Content changes (questions, answers, images, design): publish your Q again and every embed updates automatically. You do not have to touch your website.
- Embed setting changes (max width, auto scroll, fixed height, lazy loading, No JavaScript): the embed code itself changes, so copy the new code and replace the old snippet on your site.
If your Q does not load, sizes wrongly, or makes the page jump, work through Embed troubleshooting.
Frequently asked questions
How do I embed a Q on my website?
Go to PUBLISH in the Qzzr Creator, click on Embed/Landing page, click on GET THE CODE, click on COPY in the pop-up, and paste the snippet into your website wherever the Q should appear. The Q has to be published first.
Where do I find the embed code of a Q?
In the Qzzr Creator under PUBLISH > Embed/Landing page > GET THE CODE. The same screen also holds the landing page link and, under ADVANCED, all embed options.
Does an embedded Q work on mobile?
Yes. The standard embed code uses JavaScript and CSS to resize automatically for smartphones and tablets, whatever max width you set. Resizing only works while JavaScript and CSS are enabled, so a No JavaScript embed needs a fixed height instead.
Do I have to update the embed code every time I edit my Q?
No. Publish your Q again and the changes appear automatically wherever it is embedded or linked. You only need to copy the code again when you change an embed setting under PUBLISH > Embed/Landing page > ADVANCED, because that changes the snippet itself.
Why is my embedded Q not loading?
The most common cause is a security or optimization plugin on your site that blocks third-party iframes. Disable such plugins briefly to test, and if that fixes it, allow third-party iframes in their settings. See Embed troubleshooting for lazy loading, sizing, and scrolling issues.
My embedded Q is too big or too small. How do I fix it?
A Q fits into the container you place it in, so first check the width of that container. For a full-width Q, set Max. width to 100% under PUBLISH > Embed/Landing page > ADVANCED, then copy and paste the new embed code.
Can I share a Q without embedding it?
Yes. Every published Q also has a hosted landing page you can link to directly from the same Embed/Landing page screen. You can make that landing page full-screen if you want it to fill the browser window.