> ## Documentation Index
> Fetch the complete documentation index at: https://docs.yukoreviews.com/llms.txt
> Use this file to discover all available pages before exploring further.

> Description of your new file.

# Questions & Answers Display Widget

### **Navigation**

Yuko Dashboard → **Reviews → Widgets → Q\&A Display Widget**

<Frame>
  <img src="https://mintcdn.com/yukoreviews/2A4-jGC_tIjwzp80/images/yuko-Q&A-display-widgets.png?fit=max&auto=format&n=2A4-jGC_tIjwzp80&q=85&s=e4eff4405264abbf1351f1f3db56938f" alt="Yuko Q&A Display Widgets" width="2810" height="1362" data-path="images/yuko-Q&A-display-widgets.png" />
</Frame>

### **Overview**

The **Display Widget** shows all published Q\&As for a specific product, helping customers find quick answers before contacting support.

You can position it anywhere on your product page or sidebar — or use it in combination with review widgets for a complete social proof section.

### **Setup Steps**

1. Go to **Yuko Dashboard → Reviews → Q\&A Display Widget**
2. Customize the following options:
   * **Color** – Adjust text, border, and background colors to fit your store’s design.
   * **Preferences** – Control how questions and answers are shown to customers (sorting, visibility, and structure).
   * **Advanced CSS** – Add custom styling for a fully branded appearance.
3. Use the **desktop / mobile preview toggle** at the top to see how it looks across devices.
4. Click **Save** to apply your changes instantly.

### **Widget Configuration Options**

| **Setting**      | **Description**                                                                                |
| :--------------- | :--------------------------------------------------------------------------------------------- |
| **Color**        | Personalize widget elements such as button color, highlight tones, and reply backgrounds.      |
| **Preferences**  | Define how Q\&A items are displayed — including order, pagination, and store reply visibility. |
| **Advanced CSS** | Apply custom CSS rules for advanced layout and style control.                                  |

### 1) Color Settings :

**Layout**

* Background color
* Hover Background color
* Text color
* Hover Border color
* Date color

**Reply Section**

* Reply Text Color
* Reply Title Color
* Background color

**Buttons**

* Background
* Background Hover
* Text
* Text Hover
* Border color

### **2) Preferences**

**Display Controls**

* Show question date
* Show question reply date
* Show “Ask a Question” button

**Questions Per Page**

* 10
* 5
* No limit

**Titles**

* Title

**Tabs**

* Questions tab text

**Reply Section Text**

* Reply Header Text

**Buttons**

* Ask a Question Text
* Pagination Button Text

### **3) Advanced CSS**

For full design control.

You can embed CSS to:

* Re-style form layout
* Adjust typography
* Modify button styles
* Support dark/light themes
* Override theme-specific limits
  (Ideal for developers and custom UI requirements.)

### **Display Features**

* **Integrated Reviews + Questions Tabs**\
  Customers can switch between product reviews and Q\&As in a single unified widget.
* **Prominent Call-to-Action Buttons**\
  “Ask a question” and “Write a review” buttons appear clearly under the rating summary to encourage user engagement.
* **Highlighted Store Replies**\
  Merchant responses appear in visually distinct boxes for improved readability and trust-building.
* **Optional Date Display**\
  Show or hide question and reply timestamps depending on your storefront style.
