# Installing Code Components

## Sygnal Marketplace

{% embed url="<https://youtu.be/mUWAetqwfvw>" %}

Sygnal is just releasing a Marketplace to simplify the installation of Webflow Code Components into your Webflow workspace.&#x20;

### Before You Continue&#x20;

Currently code components can be installed in sites which;&#x20;

1. Have a Paid Site Plan, *or*&#x20;
2. Are in a Paid Workspace&#x20;

{% hint style="info" %}
**INSTALLING IN CLIENT WORKSPACES** \
The interface for generating the workspace-level API token can only be accessed by a workspace owner. If you are an Agency/Freelancer guest, you will need the workspace owner to generate the token for you.
{% endhint %}

## Obtaining Your Workspace API Key&#x20;

Currently, all systems integrations required for the installation are fully automated, except one- provisioning the API key needed to install your selected libraries into your workspace.&#x20;

### STEP 1: Log into Sygnal Marketplace

Use any Google Account, but use one you'll remember later.&#x20;

### STEP 2: Add a Workspace

On the main screen you'll see an Add Workspace button, and a list of any workspaces you've already added. When you click it, you'll see the Add Workspace form;&#x20;

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

### STEP 3: Enter the Workspace Details&#x20;

1. Enter a descriptive workspace name you'll remember.&#x20;
2. Create and copy-paste your Workspace API token ( see below )
3. Click Add Workspace to confirm&#x20;

### How to Generate a Webflow Workspace API Token&#x20;

{% hint style="warning" %}
Make sure to open a new tab, **CTRL+N** in Chrome, so that your Add Workspace form remains ready for you to paste the API token in.&#x20;
{% endhint %}

1. Visit your [Webflow dashboard](https://webflow.com/dashboard) to see your default workspace.&#x20;
   1. If you own multiple workspaces, and want to choose a different one, you can select from the [Workspaces list](https://webflow.com/dashboard/workspaces).
2. In the left menu under **Settings**, expand **Apps & Integrations**, and click **Manage**. &#x20;

<figure><img src="/files/6yh0cgiH7br7ruaeUwpH" alt=""><figcaption></figcaption></figure>

3. Scroll to the bottom of the page, to the **Workspace API access** section
4. Click the blue **Generate API token** button&#x20;

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

5. Enter the API Token settings here-
   1. Any name, but we recomment `Sygnal Marketplace` for easy identification&#x20;
   2. **Code components** permissions must be **Read and write**.&#x20;
6. Click **Generate token**&#x20;

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

{% hint style="success" %}
At this point, Webflow generates your **API token**. &#x20;
{% endhint %}

7. **Copy and paste this token into the Add Workspace form's Webflow API Token field ( shown above ), and then click Add Workspace to encrypt and save it.**
8. Once that's done, you can click the Hide token forever button here.&#x20;

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

Once hidden, you will see your token here.  You can Revoke it at any time, but you will no longer be able to install libraries from Sygnal Marketplace until you generate a new one.

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

{% hint style="success" %}
**CONGRATULATIONS!** \
Sygnal Marketplace will now list your workspace in your account, and allow you to install the libraries you choose.&#x20;
{% endhint %}

## Important Notes&#x20;

* If you make any mistake, and hide the token before successfully adding and saving it in Sygnal Marketplace, don't worry.  Just Revoke that token and repeat the process.&#x20;
* If you have multiple workspaces, you will need to register each of them individually with Sygnal Marketplace, using Add Workspace&#x20;
* Currently, you must be an owner of the workspace&#x20;
  * If you are an Agency/Freelancer guest in the workspace, then the owner will need to perform this step and give you the API key to add. Please use a secure communication channel if you do this.&#x20;
* Sygnal Marketplace encrypts your key before storing in our database&#x20;


---

# 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://sygnal.gitbook.io/sygnal-webflow-components/cc/installing-code-components.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.