Embed Figma Files

Figma is a web-based design tool used for creating user interfaces and graphic designs, known for its real-time collaborative features.  To be able to embed Figma on your Portfoliobox website, you first need to create a Figma account. 

Get the sharing link from Figma

1. Login to your Figma account.
2. Open the file you wish to embed
3. Click the Share button and click Get embed.
4. A new window will appear, and you will see a code that looks like this:
   
   

   <iframe style="border: 1px solid rgba(0, 0, 0, 0.1);" width="800" height="450" src="https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FWCSmCCvuGdw1xWTsrDYuo2%2FWebsite-Wireframe%3Ftype%3Dwhiteboard%26node-id%3D0%254A1%26t%3Dyoypz1tkSdpjd9TE-1" allowfullscreen></iframe>
   

   
   
5. You only need to copy the link between the quotation marks (bold in the example above):
   
   

   https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FWCSmCCvuGdw1xWTsrDYuo2%2FWebsite-Wireframe%3Ftype%3Dwhiteboard%26node-id%3D0%254A1%26t%3Dyoypz1tkSdpjd9TE-1

Add the Figma element into your Portfoliobox site

1. In your Portfoliobox site, right-click on an element
2. In the Context menu, click Add Element Below.
3. Go down to Embed.
4. Choose Figma and click Add.

The element is added but is empty. You now need to paste the link from Figma.

Paste the link to the Figma file

1. Righ-click the Figma element you just added.
2. Choose Change content.
3. Paste the link.
4. Click Save.

Style the element

Change the element's style to edit its width and height if needed.

Related topics

• List of third-party elements
• Adding elements within a section