# Button

## What is a Harness button?

Your button goes wherever your visitors do and increases conversions by allowing them to make a donation at any time, in just a few taps.

## 🔘  Create your button

Your button is pre-configured when you get your Harness account setup. We recommend you make it yours by customizing it to fit your brand and site feel.&#x20;

1. Change the color
2. Customize the text
3. Add an Emoji!

{% embed url="<https://www.loom.com/share/80e6938ed8364540a7c4c4a2c945c1d8>" %}
Button Custimization
{% endembed %}

## Button Customization:art:

You can make your button more effective by adding custom elements to how it looks and feels.&#x20;

* Button Color = Pick your hex code
* Roundness of Button:&#x20;
  * 0 = a square button
  * 8 = defualt button&#x20;
  * 40 = oval
* Button Text = call to action examples can be text or you can add emojis&#x20;
  * Examples include:
    * Join
    * Donate
    * Give
* Button Icon = sometimes you would like an icon to represent your org
* Button Placement = where you want your button to appear
  * Bottom Right
  * Bottom Left

## Add button ⚡

Don't worry if you're not technical! We'll walk you through the setup process step by step :)

**Step 1:** Log in to your Harness Admin Dashboard

**Step 2:** In your "Settings" - click on the "Website Code" tab (or [Click Here](https://admin.harnessapp.com/settings/website-code))

**Step 3:** Copy the "Harness your Website" Code

**Step 4:** Paste this code into your website's footer just before the \</body> tag on all pages you'd like for the "Donate" widget to be displayed.

{% embed url="<https://admin.harnessapp.com/add-campaign>" %}
Click ☝️ to edit your button
{% endembed %}

{% content-ref url="/pages/-M9JwAKBO6tuNBohxeSJ" %}
[Adding the button to your site](/harness/admin/adding-the-button-to-site.md)
{% endcontent-ref %}


---

# 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://harness.gitbook.io/harness/checkout/button.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.
