Embed your spreadsheet tool into Wix

Wix is powerful site builder. This guide will walk you through the necessary steps to transform a spreadsheet (Excel or OpenDocument) to a dynamic web app that you can add to your Wix website.

Takeaway

Wix toolbox offers a content type "Embeds > HTML, IFrame". Add it to the page of your choice and paste the code generated by Appizy into it. You are ready to go live!

Troubleshooting

Having trouble with Wix embed? Check the paragraph <a href="#troubleshooting">bellow</a>.

Create or prepare your spreadsheet tool

Whenever you start from scratch or reuse an existing file we recommend you to read carefully the guide of best spreadsheet practices for Appizy. We took the time to gather some simple guidelines for you to get the best results out of our software.

If you need some inspiration, go to the “Sample” page of the converter. There are some spreadsheets available for download directly from this page.

Convert to HTML and download the code

Once ready with your spreadsheet, load the file into the online converter.

Take the time to explore different settings. Depending on the aim of your application, you might enable the “Save locally” option. This allows your users to save what they entered into your web app and avoid losing their data once they close their browser.

Important (for users with PRO plan): keep the setting “Package” at “One single file”.

Once converted, download the archive containing the code of your web application. Unzip it and open the folder: there is a single index.html file. It contains all the code required for your application to run.

Note: if you just want to try the embed functionality in Wix, you can download the code generated from the sample application. This is free to use.

Add a Wix Embed

Embed is a kind of content you can add to your Wix Website. It accepts raw code like HTML, CSS, and JavaScript. Perfect, just what we needed!

Go the page where you want to embed your content. Go to the menu on the left to select the tab with the “+” sign. You will see a list of items, then click on the theme “Embed”. A window will appear on your right with different items integrated, select “Embed a widget”. The selected content will be automatically added to your page.

On the top left corner of this new content click the “Enter Code” button. A dialog box opens requesting the code you want to add to your plugin. Open the HTML file of your application. Do not double click on it, this will open it into your favorite browser. Instead, right-click and open with the code editor of your choice.

Copy the entire content of the HTML file and paste it into the dialog of the Wix Embed. Then close the dialog field. Your application appears on your website. Finally position and resize your embed widget.

You have now a dynamic spreadsheet tool on your Wix website! Great work. Preview your website and also check the mobile preview. Everything is ready to go live.

Troubleshooting

Last update: August 24, 2020

Some users reported trouble only with HTTPS: Appizy generates codes with HTTPS anchors only. Wix interface is in this respect a bit misleading. What is happening? When the pasted code is too big, Wix crashes and does not save what you just copied. That is why the embed section looks like a grey square.

The code generated by Appizy contains line breaks and spaces to make it easy to read by a human, but this is also making the code larger. Removing the extra space (= minifying the code) can cut the file size by 2 and allows you to embed your app into Wix.

You can use this online Minifier to compress your code. On our side, we plan to add automatic minification into Appizy converter to avoid any manual step.

Based on user feedback we estimate the maximum file size around 1 Mb. If your file is still above this limit after minification you might not be able to embed your app into Wix. We apologize for this limitation. If you have any questions, do not hesitate to drop us an email.

Conclusion

In this article, you have learned all the necessary steps to add a dynamic application to your Wix website starting from your spreadsheet tool. Thanks to the Wix Content called “HTML, IFrame” you can easily add a code snippet to your page. Generate a single file application with Appizy (this is the default behavior). Copy and paste the full code created and paste it into the Wix content. That’s it!