> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.quizell.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How to Embed Your Quiz in Webflow

## **Introduction**

Embedding your **Quizell quiz** in Webflow is a quick and effective way to make your site more interactive and engaging. Using the **Quizell Webflow App**, you can seamlessly integrate your quiz into any page and fully customize its look to match your site’s design.

## **Step-by-Step Guide**

### **Step 1: Install the Quizell App in Webflow**

1. Log in to your [**Webflow**](https://webflow.com/) account.
2. Go to the **Webflow App Store** and search for **Quizell**, or install it directly from [this link](https://webflow.com/apps/detail/quizell-product-quiz).
3. Click **Install App**.
4. Choose the **sites or workspaces** where you want to use Quizell.
5. Click **Authorize App** to complete the installation.


![Quizell in Webflow](https://storage.crisp.chat/users/helpdesk/website/-/9/c/4/e/9c4e823823ced00/screenshot-0810-021226-hhts_1q7f4c8.jpg =1000x538)

### **Step 2: Add Your Quiz to a Webflow Page**

1. Open **Webflow Designer** and go to the page where you want the quiz to appear.
2. Add or select a **block element** (e.g., Div Block or Section) for the quiz placement.
3. In the **Quizell App panel**, click **Select Quiz**.
4. In your **Quizell dashboard**, find and select the quiz you want to embed.
5. From the left-hand menu, go to **Share → Share your quiz as a link**.
6. Copy the quiz link provided.

💡 **Important:** Before embedding, replace the word `preview` in the link with `quiz` to ensure optimal performance**.**
Example:
* Original: `https://app.quizell.com/preview/QuizID`
* Updated: `https://app.quizell.com/quiz/QuizID`

![How to get your quiz link](https://storage.crisp.chat/users/helpdesk/website/-/9/c/4/e/9c4e823823ced00/screenshot-0810-021733-hhts_1z0fr8c.jpg =1000x538)

### **Step 3: Embed and Customize Your Quiz**

1. Paste the updated link (e.g., `https://app.quizell.com/quiz/QuizID`) into the **Quizell embed field** in Webflow.
2. Click **Embed**.
3. Adjust the **styling, width, and layout** within Webflow to match your site’s design.
4. When you’re satisfied, click **Publish** (top-right corner) to make your quiz live.

![Embed your quiz at webflow](https://storage.crisp.chat/users/helpdesk/website/-/9/c/4/e/9c4e823823ced00/screenshot-0810-021456-hhts_1kj202m.jpg =1000x538)

## **🎉 You’re All Set!**

Your **Quizell quiz** is now live on your Webflow site!
Use Webflow’s flexible design tools to refine the layout and ensure your quiz fits seamlessly into your page’s design.

## **What’s Next?**

Learn more ways to share and customize your quiz:

* [How to Embed Your Quiz in Wix](https://help.quizell.com/en/article/how-to-embed-your-quiz-in-wix-1dx0wxq/)
* [How to Embed Your Quiz in Shopify using App Embeds](https://help.quizell.com/en/article/how-to-embed-your-quiz-in-shopify-using-app-embeds-1wls0vb/)
* [How to Personalize Quiz Content Using User Data](https://help.quizell.com/en/article/how-to-personalize-quiz-content-using-user-data-in-quizell-15lev1j/)
* [How to Customize Your Loader](https://help.quizell.com/en/article/how-to-customize-your-loader-10jfate/)