# Framer Integration

Watch our step by step video on how to integrate Arvow with Framer:

[Embed](https://www.youtube-nocookie.com/embed/08Gw_WmKpm8)

## Overview

The Framer integration lets Arvow publish articles directly to your Framer website. Once connected, articles you create in Arvow are sent straight to your Framer blog (published immediately or saved as drafts for you to review first).

To set it up, you'll need two things from Framer:

- **Your Framer API key**: a unique code that lets Arvow connect securely to your Framer project.
- **Your Framer project URL**: the web address of your Framer project.

## Setting Up the Framer Integration

1. In Arvow, go to the **Integrations** tab.
2. Click **Create Integration**.
3. Select **Framer**.
4. Give your integration a name.

### Getting Your Framer API Key

1. Open your project in Framer.
2. Go to **Settings** → **General**.
3. Scroll to the bottom until you see the **API Key** section.
4. Click **Add** and give the key a name (e.g., *Blog*).
5. Click **Create**, then copy the API key.
6. Paste it into the API key field in Arvow.

### Getting Your Framer Project URL

1. Go back to your project in Framer.
2. Select the canvas (the main area where you edit your site).
3. Copy the URL from your browser's address bar (the full link starting with `https://`).
4. Paste it into Arvow.

> [!TIP]
> 👍 Arvow will now retrieve your project information from Framer. This may take a few moments.

### Choosing How Articles Are Published

While Arvow loads your Framer information, choose how new articles should arrive on your website:

- **Publish immediately**: keep the toggle enabled, and articles go live on your Framer website as soon as they're sent.
- **Send as drafts**: disable the toggle, and articles arrive in Framer as drafts so you can review them before publishing.

### Selecting a Collection and Mapping Your Fields

In Framer, a **Collection** is where your blog content is stored - usually named something like *Blog*.

Once Arvow has fetched your Framer information:

1. Select the **Collection** where your articles should be published.
2. Match each article element to the corresponding field in your Framer Collection:

| ***Article element*** | ***Framer field to select*** |
| --- | --- |
| **HTML** | The field that holds your article text (e.g., *Content*) |
| **Title** | Your title field |
| **Meta Description** | A meta description field, if you have one |
| **Feature Image** | Your image field |

> [!NOTE]
> 📘 Don't see a specific field? You need to create it in Framer first: open your **CMS**, go to **Fields**, and create a new field. It will then appear as an option in Arvow.

3. Click **Create**.

> [!TIP]
> 👍 Your integration is now created, and Arvow can start publishing articles automatically to your Framer website.

## Checking Your Published Articles

After Arvow publishes an article, you can find it inside Framer:

1. Open your Framer project.
2. Go to your blog Collection.
3. Your article will be there - live or as a draft, depending on the publishing option you chose.

## FAQs

**Q: Can I review articles before they appear on my website?** Yes. When setting up the integration, disable the immediate publishing toggle. Articles will then be sent to Framer as drafts, and you can publish them manually whenever you're ready.

**Q: I don't see an image field when mapping. How do I add one?** Create it in Framer first: open your **CMS**, click **Fields**, and add a new field for images. Once created, it will show up as an option when mapping fields in Arvow.