Introduction

Embedding your Quizell quiz into a WordPress website with Elementor is a straightforward process that enhances your site’s interactivity. With just a few steps, you can seamlessly integrate your quiz and customize its appearance to align with your brand.

Step-by-step Guide

Step 1: Find your Quiz HTML code

Open your Quizell account.

Navigate to the Quizzes section and locate the quiz you want to embed.

Click the three dots next to your selected quiz and select Share from the menu.



In the Sharing section, select Embed on a webpage.

Toggle the HTML button in the left-side menu.

Choose your preferred display option:

· Full Page

· In Page

· Popup

· Greet Bar

· Floating Button

Each option customizes how the quiz will appear on your Shopify page.

Copy the script and div code provided.

Step 2: Embed the Quiz HTML code in WordPress

To add your quiz to a page or post, use the Elementor HTML Widget. Read this Elementor article, or follow the instructions below:

Open your WordPress dashboard and go to the page or post where you want to embed your quiz.

In the Elementor editor, locate the HTML Widget.

Drag and drop the HTML Widget onto your desired section of the page.



Paste the copied Quizell HTML code into the text area of the widget.



Make sure to wrap:

• Any CSS code with tags at the beginning of your code.

• Any JavaScript code with tags at the end of your code.

Save your changes and preview the page to ensure the quiz displays correctly.

🎉 That’s it! Your Quizell quiz is now embedded in your WordPress site using Elementor. Customize the widget’s size, alignment, and styling to create a seamless and engaging experience for your visitors.

Updated on: 13/12/2024