# Publishing your quiz When you’ve finalized your quiz, you can publish it to your store through several methods. You can [add your quiz to a page](#publishing-your-quiz-on-a-page), [add it as a section on a page](#publishing-as-a-section-on-a-page), [embed it as a pop-up](#embedding-your-quiz-as-a-pop-up), and [embed it as a code snippet](#embedding-your-quiz-as-a-code-snippet). Once you've published your quiz in any of the available methods, it will be live and discoverable to your customers. ## In this section * [Making your quiz live](#making-your-quiz-live) * [Publishing your quiz on a page](#publishing-your-quiz-on-a-page) * [Publishing as a section on a page](#publishing-as-a-section-on-a-page) * [Embedding your quiz as a code snippet](#embedding-your-quiz-as-a-code-snippet) * [Embedding your quiz as a pop-up](#embedding-your-quiz-as-a-page-pop-up) *** {% embed url="" %} ## Making your quiz live You need to make your quiz live on your store before you can publish it to any other location. **Steps:** 1. From the Quiz Kit app, click **My Quizzes**, then click **Customize** on the quiz that you want to publish. 2. On the left-side menu, click the globe icon to navigate to the **Publish** settings. 3. By default, your quiz is in draft mode. Click the toggle beside `Ready to publish` to publish your quiz. Once your quiz is live, additional publication options appear below. By default, a quiz that you publish to your store creates a new page in the **Pages** section of your Shopify admin and a live customer-facing page in your store. Your quiz's unique page is only discoverable to customers if you give them the page link or if you publish it by any of the methods detailed below. *** ## Publishing your quiz on a page By default, making your quiz live as detailed above automatically creates a page in the **Pages** section of your Shopify admin. You can further edit and publish this standalone page to your preference.
**Steps:** 1. From the **Publish** menu in the Quiz Kit app, go to the **Add to a page** section. 2. To preview the quiz on your page with the current publication settings, click **Preview** **page**. When you’re done, click **Close preview** to exit the preview mode. 3. If you want to make edits to your page settings before publication, then take note of what page name displays beside **Published on**. You can then locate it in the **Pages** section of the Shopify admin. 4. Click on the page you want to edit, make any changes you want, and then click **Save**. Your quiz displays on the selected page. You can also choose to hide this page when your quiz is published by clicking the **Visible** button and selecting **Hidden** from the drop-down. {% hint style="info" %} **Note:** If you want your quiz to be full-width on your pages, you can create a new template. You can apply the same template to any quiz page. [Learn more about making your quiz full-width](https://support.quizkitapp.com/faqs/how-do-i-make-published-quiz-on-a-page-full-width). {% endhint %} *** ## [8 Key Places to Promote your AI Product Quiz](https://www.quizkitapp.com/blogs/our-blog/8-places-to-promote-your-ai-product-quiz/)
*** ## Publishing as a section on a page You can add your quiz as a section on a page. You need to follow different instructions depending on whether your current store theme is an Online Store 2.0 theme or a Vintage theme. [Learn more about Shopify’s theme versions.](https://help.shopify.com/en/manual/online-store/themes/managing-themes/versions) ### Add a section to Online store 2.0 **Steps:** 1. From the **Publish** menu in the Quiz Kit app, go to the **Add as a section to a page** section, then click **View instructions**. 2. Under step 1: **Copy your quiz key**, click the clipboard icon to copy it. 3. Under step 2, click **Select theme** and then click the theme that you want to add the section to. 4. Click **Add to theme**. This launches a new tab with the theme editor. 5. By default, the section is added to your homepage, but you can move it to any page in the theme editor. 6. Under **Apps**, click the new section block to open the settings, and paste the previously copied quiz key in the **Quiz key** field. The quiz displays in the preview modal of your theme editor. You can drag the section to reorder if needed. 7. Click **Save**. ### Add a section to a Vintage theme #### Part 1: Add a new template to your theme 1. From the **Publish** menu in the Quiz Kit app, click **Add as a Section** on a page. 2. Click **Vintage themes** from the tabs at the top of the section. 3. Click **Copy** under the block of code to copy it to your clipboard. 4. From the Shopify admin, click **Online Store**. 5. Click **Themes**, then click **…** to display more options, then click **Edit code**. 6. Click **Sections**, then click **Add a new section**. 7. Ensure liquid is selected, and enter quiz-kit-app under **File name**. 8. Click **Done**. 9. Select and delete all the code in the new template that you’ve created. 10. Paste the previously copied code from your clipboard into the blank template. 11. Click **Save**. {% hint style="info" %} **Note:** If you later uninstall the Quiz Kit app, this template will also need to be deleted. {% endhint %} #### Part 2: Add the section to your theme 1. From the app instructions page, in section 2, click **Copy** to copy your quiz code. 2. In the theme editor, go to the page you want to embed the quiz on. 3. Under **Template**, click **Add a section**. 4. Click **Apps** to search from the correct list, then select **Quiz** from the list of apps. 5. Click the new section block to open the settings, and paste the previously copied quiz key in the **Quiz Key** field. The quiz displays in the preview modal of your theme editor. You can drag the section to reorder if needed. 6. Click **Save**. *** ## Embedding your quiz as a code snippet **Steps:** 1. From the **Publish** menu in the Quiz Kit app, go to the **Embed with code** **snippet** section, then click **View instructions.** 2. Under step 1: **Copy the code**, click the clipboard to copy the snippet to your clipboard. 3. Under step 2, click **Select theme**, then click the theme that you want to add the section to. 4. Click **Edit theme code**. This launches the theme code editor in a new tab. 5. Click the file in your theme that you want to add the code to, then paste the code. 6. Click **Save**. {% hint style="info" %} **Note:** If you later uninstall the Quiz Kit app, this template will [also need to be deleted](https://support.quizkitapp.com/account-and-settings/billing-and-account#step-1-uninstall-the-app-and-cancel-your-subscription). {% endhint %} *** ## Embedding your quiz as a page pop-up You can embed your quiz so that it pops up when your customer navigates to a specific page, or if you have an Online Store 2.0 theme, if they click on a specific button. There are different setup methods for each option. {% hint style="info" %} **Note:** If you’re on a legacy plan, then this feature is available for the **Middle** plan or higher. {% endhint %} **Steps:** 1. From the **Publish** menu in the Quiz Kit app, go to the **Embed as a popup** section, then click **View instructions**. 2. Under step 1: **Copy your quiz key**, click the clipboard icon to copy it. 3. Navigate to the **Online Store** > **Content** > **Menus** section of your Shopify admin. 4. Select a menu item, then click **Add menu item**. 5. Paste your previously copied code from the clipboard into the **Link** field. 6. The **Label** field will auto-populate. To change it, click the field and edit the text. 7. Click **Save**.