Website Building » Wix » How Do I Add Figma Prototype to Wix?

How Do I Add Figma Prototype to Wix?

Last updated on December 16, 2022 @ 3:23 am

To add a Figma prototype to your Wix site, follow these steps:
1. In Figma, select the “Prototype” that you want to add to your Wix site.

Select Figma prototype to embed to wix

GREAT NEWS:

Exciting update! We've collaborated with Wix to offer WBI users with a free plan for all website creation needs - Explore the details here.

2. Click “Share” in the top-right corner of the prototype window.

Click share button Figma

3. Click “Copy Link” in the pop-up window that appears.

Copy prototype link Figma

Or click “Get embed code” and copy.

Click get embed code Figma Copy Figma prototype embed code to wix

PRO TIP: If you are planning to add a Figma prototype to your Wix website, be aware that there are some potential risks involved. First of all, if you are not careful, it is possible to accidentally embed the prototype into your live website, which could cause confusion or even break your site. Secondly, if you do not take the time to properly test your prototype before adding it to Wix, you could end up with a buggy or non-functional prototype on your hands. So, while adding a Figma prototype to Wix can be a great way to add interactive elements to your site, just be sure to proceed with caution.

4. Log in to your “Wix” account and go to your site’s editorGo to Wix site editor

5. Click “+ Add” on the left side of the editor.

6. Select “More” or “Embed code” from the list of options that appear.

7. Click “Embed a Site” from Figma on the left side of the pop-up window that appears.

Embed site to Wix

8. “Paste” the link to your Figma prototype into the box on the left or right side of the pop-up window and click “Embed Site” or “Apply“.

Paste Figma prototype link in wix input field Paste Figma embed code to wix

Finally, “Preview” your site, and your embedded link or code should now look like this.

Figma prototype embedded in wix site

Kathy McFarland

Kathy McFarland

Devops woman in trade, tech explorer and problem navigator.