--- title: "Adding the Q&A Widget 3.0" slug: "adding-the-qa-widget-to-shopify" tags: ["Shopify", "Shopify Plus", "Reviews "] updated: 2024-04-01T22:13:13Z published: 2024-04-01T22:13:13Z canonical: "support.yotpo.com/adding-the-qa-widget-to-shopify" --- > ## Documentation Index > Fetch the complete documentation index at: https://support.yotpo.com/llms.txt > Use this file to discover all available pages before exploring further. # Adding the Q&A Widget to Shopify Products Reviews ###### Supported plans Pro, Premium, Enterprise ###### eCommerce Platform Shopify, Shopify Plus The Q&A widget lets visitors to your store ask questions about your products as well as view popular questions and answers that have been asked previously. In this article, you’ll learn how to add the new Q&A widget 3.0 to your store. **Available for:** Merchants using the new beta Q&A widget. If you’re using the previous version of the widget, see [this article](/v1/docs/qa-widget-overview) ## Before you start Before you add the Q&A widget to your store, make sure you’ve set up your Q&A emails and other settings. See [Setting up Q&A emails](/v1/docs/setting-up-qa-emails) ## Adding the Q&A widget Use the flow below to add the new Q&A widget or to migrate your existing Q&A widget. ### Customize your widget To customize your widget: 1. In your Yotpo Reviews main menu, go to [On-Site Widgets](https://reviews.yotpo.com/#/display-reviews/on-site-widgets). 2. Click **Q&A 3.0**. 3. Customize the widget according to your needs. Scroll down to learn about [customization options](/v1/docs/customizing-the-qa-widget-30) 4. Click **Save changes**. 5. Click **Preview** to preview your changes. 6. When you’re ready to publish, click **Go live.** ### Install the Q&A widget (required) If you’re using **Shopify 2.0**, you can add Q&A to your store using this flow: 1. Click **Open Shopify** to open the Shopify theme editor in a new tab. 2. On the left of your screen, add a block or section. 3. Select and add Q&A, and place it in your desired location. 4. Click **Save**. If you’re using a **Shopify vintage theme**, use this flow: 1. Locate the file that manages your basic product page content and settings. This is usually called **product.liquid** or **main-product.liquid**. 2. Copy and paste the Yotpo script under the last line of code. 3. Paste the Q&A code snippet into your site code. 4. Click **Done.** ## Customization options ### Q&A placement Define where you want to display Q&A on your store. This option is available in the **General Settings** of your Q&A widget. | **Setting** | **Description** | | --- | --- | | Q&A placement | Choose whether you want Q&A to display:- In the first tab of your Reviews Widget- In the second tab of your Reviews Widget- In a new, separate widget | ### Colors & style Define the colors, fonts, and other look and feel settings for your widget. These options are available in the **General Settings** of your Q&A widget. | **Setting** | **Description** | | --- | --- | | Primary color | The color used for the aggregated tab names, “Ask a question” button, and shopper status | | Text | The color used for the title, shopper names, avatars, and pagination | | Background | The background color of the Q&A widget on the product page in your website | ### Widget header Define the headline text and summary text. These options are available in the **Widget Header** settings of your Q&A widget. | **Setting** | **Description** | | --- | --- | | Headline text | When on, displays a header at the top of the Q&A widgetDefault: On | | Text | The text that is displayed at the top of the Q&A widgetDefault: Questions & Answers | | Widget summary | The text that is displayed under the headlineDefault: {answered_questions_count} answered questions | ### Questions Define the display settings for your questions and answers. These options are available in the **Questions** settings of your Q&A widget. | **Setting** | **Description** | | --- | --- | | Avatar | When on, displays the shopper avatarDefault: OnNote: The shopper name is the name provided by the user the first time they ask a question or leave a review. Even if that same user later changes the name associated with their email account, the initial name will continue to be applied to all future interactions. | | Name format | Choose to display either the shopper’s first name and initial, or their initials only. Default: First name + initial | | Date | When on, displays the date the review was submitted. Default: On | | Date format | The date formatDefault: DD/MM/YY | | Store answer title | The title displayed above any answers you submit. Default: Store Owner | | Email customization | We’ll send email notifications to shoppers on your behalf in the following situations: - Notify a shopper that an answer was submitted for a question they asked - Notify a customer that somebody asked a question about a product they purchased in the past To customize these emails, click **Go to Q&A email settings**. | ### Empty state Define what your widget looks like before you’ve started displaying Q&A. These options are available in the **Empty State** settings of your Q&A widget. | **Setting** | **Description** | | --- | --- | | Empty State | When on, and you haven’t published any Q&A yet, displays text inviting shoppers to ask a question. Default: On | | Subtitle text | The body text of the empty state | | Button text | The button text of the empty state | | Button color | The color of the button in the empty state | ## Related - [Setting Up Q&A Emails](/setting-up-qa-emails.md) - [Customizing the Q&A Widget](/customizing-the-qa-widget-30.md)