# Integrate buttons & text links

### Widget (optional)

Our customizable widget is a great choice for easy access to the color wheel. Learn more at <https://hoppn.com/widget>

<figure><img src="/files/FGWMbbz4udzTCdp1qhXh" alt=""><figcaption></figcaption></figure>

🥇 Best practices:&#x20;

* Rainbow widgets attract your most color-focused customers.
* Do NOT use a muted color widget or match the accent color on your site. These widgets blend in and fail to attract clicks.
* Quality check: If you use the widget, ensure it does not obscure critical buttons on mobile, such as "Add to cart."&#x20;

### 🔗 Add a "Shop by Color" header link.&#x20;

Turn any button or text into a trigger for opening the color search overlay.&#x20;

**How it works:**&#x20;

1. Paste this in the hyperlink field:&#x20;

```
/?InfiniteColorSearch
```

When the Embed App is on, clicking the link will open the color search overlay.&#x20;

<figure><img src="/files/CEbCFfKursnxmi1VVhbf" alt=""><figcaption></figcaption></figure>

Shopify has a strange quirk requiring you to click here rather than the red checkmark. If you click the red checkmark, it will return an error, and the link will not save.

<figure><img src="/files/wGSaV2AOjj64ktpAx5l6" alt=""><figcaption></figcaption></figure>

🥇 Best practices:&#x20;

* "Shop by Color" link in your header.
* Add a color-focused banner image with a "try it out" button that links to the color search.&#x20;

<figure><img src="/files/mVF0KWrAbEMSrG1mi6kA" alt=""><figcaption></figcaption></figure>

#### Show widget toggle:

If you prefer, you can hide the "Search color" widget using your theme editor. Ensure the embed app remains toggled ON if you want button links to work:

<figure><img src="/files/b61Lfz4X6lu0kat8fot6" alt=""><figcaption></figcaption></figure>


---

# 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://hoppn.gitbook.io/hoppn/shopify/integrate-buttons-and-text-links.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.