# Trust Badge

![Màn hình thêm trust badge](/files/8t8xY8WsgBaJOisi96yl)

Areas of the trust badge add/edit dashboard:

**(1) Badges Library:** The library has over 1,300 pre-made badges, categorized by flexible categories and industries.

**(2) Trust Badge Preview**

**(3) Trust badge editor:** Options for Trust Badge's adjustment.

**(4) Badges show on:** Choose template and position to display trust badge on store.

**(5) Name/status setting area:** Name/status setting area and trust badge saving action.

### 1. Badges Library

![Badge Library](/files/UQM49jaR3q3rx4jUSToO)

**The badges library area includes the following components:**

1. Choose Industry: Set the industry you want .
2. Search badges by name.
3. Sort badges by category All, Return...: in library catalogs.
4. My Badges: List of custom badges and uploaded badges.&#x20;
5. Featured: Display badges according to the selected industry.
6. The area allows to create custom badge / upload badge quickly.
7. The list of badges allows the user to choose.

### 2. Trust Badge Preview

Display list of chosen badges and visual changes when interacting with the Trust badge editor.

![Trust Badge Review](/files/qfAnfJZKZKUL6GUJtcUU)

Trust Badge Preview includes the following components:

**(1) Show header:** Hide/show header of Trust Badges.

**(2) The content of displayed header**

**(3) List of Chosen Badges:** At this list, there are 2 quick actions that can be used: Delete each badge and hold and drag each badge to change the position.

### 3. Trust Badge Editor

![Trust Badge Editor](/files/9T9fgcuUGjC9KoiP1HtI)

The area contains tools that allow editing trust badge visually, all operations will be displayed immediately on the Trust badge preview.&#x20;

Trust Badges Editor contains following components:

* **Size:** Adjust the size of the badges.
* **Style Color:** Set color/black and white mode for badge.
* **Animation:** Trust badge animation effect when loaded.
* **Width Box:** The width of the frame containing the trust badge. Unit %
* **Align:** Align badge: Center, left, right.
* **Badges Spacing:** Spacing between badges.
* **Spacing Around:** The distance of the trust badge container from the elements on the page.
* **Show Border:** Turn on the border and set the color and edge of the border.

### 4. Badges Show On

The area to set the display position of the trust badge on the store

![](/files/JMQgGk8XZtu9jUJEWCa6)

***Badges Show On contains following components:***

1. A short-code will be generated allowing you to copy. Trust badge will be displayed everywhere when you paste this short-code in your theme's code.
2. List of templates that allow displaying trust badge:
   * Product pages
   * Cart page
   * Collection pages
   * Search results pages
   * Home page
   * Collection list pages
3. The Css element you want to put the trust badge on: There are 2 ways to set the value for this field.

* Tap the "4" area to use the app's smart location picker.
* Import the Css element you want yourself (Suitable for developers with html/Css knowledge).

4\. Trust badge display location picker: Tap to select the location you want visually on the store.

5\. Set the display position of trust badge: Above or below the Css Element you have set up. Only available when you manually import the Css element.

### 5. Interact with the list of templates

**Product pages**

When you select the template as "Product pages", the system will display a list of products allowing you to select certain products to display that trust badge.

![Product Badge](/files/kWBXAAQsFErfFYxc1Vmo)

The system allows you to filter or type in a name to search for products according to the conditions you want.

**Collection pages**

When you select the template as "Collection pages", the system will display a list of the collections you want to display the trust badge on. The default is to select all.

![Collection Page](/files/tmfEH2xkNYM8C6kjR7GS)

### 5. Name/status setting area

![Name/Status Setting Area](/files/wciiKgxX749XZmklaOLe)

Enter the name and status of the trust badge then press the save button to save the trust badge.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://guide-shine-trust.shinecommerce.co/badges-instruction/trust-badge.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
