# 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="../admin/adding-the-button-to-site" %}
[adding-the-button-to-site](../admin/adding-the-button-to-site)
{% endcontent-ref %}

