Articles on: Embedding and Sharing

How to Embed Your Quiz in Webflow

Introduction



Adding your Quizell quiz to Webflow is a seamless way to enhance your store’s interactivity and engagement. With just a few steps, you can integrate your quiz directly into your Webflow site and customize it to match your design.

Step-by-step Guide



Step 1: Install the Quizell App in Webflow



Log into your Webflow account.

Navigate to the Quizell App on the Webflow App Store.

Click Install App.



Select sites or workspaces to authorize and click the Authorize App button.



Step 2: Add the Quiz to Your Page



Open the Webflow Page Editor and create or select a block element where you want to embed your quiz.

In the Quizell box, click Select Quiz.



In Quizell, locate the quiz you want to embed and click the three dots next to it. Select Share from the dropdown menu.



In the Sharing section, select Share your quiz as a link.

Copy the link provided.


IMPORTANT: Ensure you update the link by replacing “preview” with “quiz”.

For example:

Change: https://app.quizell.com/preview/QuizID

To: https://app.quizell.com/quiz/QuizID

This updated format enhances your quiz’s performance and responsiveness.


Step 3: Embed the Quiz in Webflow



Paste the copied quiz link (eg. https://app.quizell.com/quiz/QuizID) into the dedicated field in Webflow.

Click Embed next to the field.



Adjust the styling of your quiz within Webflow to match your design preferences.

When you’re satisfied with the result, click the Publish button in the top-right corner of your screen.



🎉 That’s it! Your Quizell quiz is now embedded in your Webflow store. Take advantage of the flexible styling options to create an engaging and interactive experience for your visitors.

Updated on: 17/12/2024

Was this article helpful?

Share your feedback

Cancel

Thank you!