FFC - How to use

Add macro to your Confluence page

After installing the Figma for Confluence app there are three ways to add the Figma for Confluence macro to your Confluence page.

Plus button

1. Click on the Plus button at the top right of your screen

2. Click on Other macro’s or View more

3. Search for Figma for Confluence

Forward slash /

1. Type / on your Confluence page
   Doing so brings up the same list you'd see by selecting from the toolbar

2. Continue typing Figma for Confluence

Paste Figma URL directly

1. Navigate to Figma & open the Figma design you’d like to embed

2. Navigate to Figma & open the Figma design you’d like to embed

3. Click on copy link and a share link will be copied to your clipboard

4. Navigate back to Confluence and paste the link directly into your Confluence page
   Make sure to edit the macro to enable additional features

Add Figma Design to your Confluence page

1. Upon clicking on the Figma for Confluence macro , the macro will pop-up on your Confluence page

2. Navigate to Figma & open the Figma design you’d like to embed

3. Click on copy link and a share link will be copied to your clipboard

4. Navigate back to Confluence and paste the link into the URL field of the macro
   In case you are using the app for the first time, you will be asked to fill in your Figma Personal Access Token

5. The Figma for Confluence app will now load your Figma file/frame

6. Select your desired macro type (link naar de verschillende types)

7. Select your desired macro height
   Due to limitations in Confluence the macro width can not be adjusted

8. Enable or disable the collapsed state

9. Click on Save to publish your Figma design

Macro types

Panel

Frameless

Canvas (Prototypes/Figjam)

Figma for Confluence (Canvas/Prototypes/Figjam)

1. Upon clicking on the Figma for Confluence (Canvas/Prototypes/Figjam) macro , the macro will pop-up on your Confluence page

2. Navigate to Figma & open the Figma file/frame you’d like to embed

3. Click on the share button at the top right off your screen

4. Click on copy link and a share link will be copied to your clipboard

5. Navigate back to Confluence and paste the link into the URL field of the macro

6. The Figma for Confluence app will load your Figma file

7. Fill in the desired Width & Height

8. Click on insert to publish your Figma File or Frame!

9. The macro will provide you with two additional options:

   1. Zooming & Panning - There is a button in the right corner of the canvas that will allow you to zoom in and out

   2. Open in Figma - Clicking on the file name in the left corner of the canvas will redirect you to the file/frame in Figma