> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://knowledge.clym.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How to customize your footer links


## Steps to take to stylize your Clym footer links on your website

In the Clym Control Center, you can generate custom footer links for your website that act as quick links for users to directly open a specific location of your Clym widget or Governance portal, allowing them to better manage their personal data. Additionally, they can be beneficial for users who may not see the widget by default based on their location, as they can gain access to the widget through the footer links.

We understand that it is still important for your website to maintain its look and feel, and this can be achieved by stylizing your footer links through CSS. Below you can find several examples of how to achieve different styling goals. Please note that the links below are just examples and should not be directly copied onto your website. Please utilize your Clym Portal to [generate your own custom footer links](https://clymio.crisp.help/en/article/how-to-generate-a-custom-footer-link-x0laqs/).

**Privacy Center link:**

```
<a href="#" onClick="Clym.showWidget('', '', event);">Privacy Center</a>
```

**Do not sell or share my personal information link:**

```
<a href="#" onclick="Clym.showWidget('/requests/new/do_not_sell_my_information', '', event);">Do not sell or share my personal information</a>
```
  
### Styling the links

Most websites have a default styling for links, and Clym does not override these settings. However, if you would like to change the appearance of these links, you need to add styling attributes to the links. These links are regular HTML *<a>*  tags that can be styled by CSS. Here is how you can change certain things:

**Text Color**  
```
<a **style="color:#000000"** href="#" onClick="Clym.showWidget('', '', event);">Privacy Center</a>
```

> Where the **#000000** is the HEX code of the color. To get the HEX code of any color, you can use any online color picker tool. For example: [Google Color Picker](https://g.co/kgs/9yZAVRY)

**Text Background**

```
<a **style="background-color:#ffffff"** href="#" onClick="Clym.showWidget('', '', event);">Privacy Center</a>
```

**Font Size**

```
<a **style="font-size:14px"** href="#" onClick="Clym.showWidget('', '', event);">Privacy Center</a>
```

**Font Weight / Boldness?**

```
<a **style="font-weight:bold"** href="#" onClick="Clym.showWidget('', '', event);">Privacy Center</a>
```

Other possible values:

* normal
* bold
* bolder
* lighter

**Underline Formatting**

```
<a **style="text-decoration:underline"** href="#" onClick="Clym.showWidget('', '', event);">Privacy Center</a>
```

> If `text-decoration` is set to `none`, it will not have underline style on it.

### Mixing different CSS attributes

If you would like to use 2 or more styling attributes on your links, you need to separate them with `;`

Let's take an example: we want bold font, blue colored links without underlining, then we will write this:

```
<a **style="color:#111198;font-weight:bold;text-decoration:none"** href="#" onClick="Clym.showWidget('', '', event);">Privacy Center</a>
```

If you encounter any challenges, please reach out to us at [support@clym.io](mailto:support@clym.io).