The easiest way to import an Excel calculator, live chart or smart form into a Blogger blog or website is to use SpreadsheetConverter Flash (Standard or Professional Edition). This tutorial will show you how to publish live Excel spreadsheets and charts in Blogger as interactive Flash files.
Adding a live calculator or chart to your website adds value to your visitors and makes your website more interactive. SpreadsheetConverter converts Excel spreadsheets, charts and tables to web-ready Flash files, that can easily be imported into your Blogger blog or website.
We originally developed the Flash flavor to make it less complicated to use live calculators and smart forms with WordPress or other blogging tools and content management systems. With the new Dropbox sharing, it’s much easier to show the calculator in an iframe. In this scenario, we recommend that you use the iPhone/Android or HTML flavors instead.
Most Blogger blogs consist of just text and static images. A simple way to make your blog or website more interesting is to add a live chart, calculator or web form to it. Help your visitors solve their problems or visualize their situation!
To create this tutorial, we took a simple calculator for UK sales tax (value-added tax, VAT) and published it in a Blogger website. To be able to embed the Excel spreadsheet in a web page, we first converted it to Flash using SpreadsheetConverter Flash.
With this clever Excel plugin you can also create advanced tables, import complex charts or open live graphs in Blogger.
Converting the spreadsheet to a Flash file was simple with SpreadsheetConverter Flash. We just opened the calculator in Excel and pressed the Convert button in the SpreadsheetConverter ribbon.
After the conversion, the Flash file and two skeleton HTML files were placed in the designated folder.
Blogger doesn’t allow you to upload Flash files. You need to save the Flash calculator somewhere else, and embed it as an object in Blogger. In our case we saved the Flash file in a free Google Sites account.
To upload the calculator we logged in to our Google Sites account and selected “More actions > Manage site”.
Flash files are part of what is called “attachments” in Google Sites. We clicked on the “Attachments” link, then on “Upload” in the menu bar.
To locate the Flash file we clicked on the “Browse” button and pointed to the .swf Flash file that SpreadsheetConverter created. When we clicked “Upload”, the file was uploaded to Google Sites.
We needed to be able to refer to the Flash file by address, so we needed to see its actual address within Google Sites. By selecting “View” for the uploaded file, we had Google Sites opening it in a separate browser window. The adress to the file was now visible in the web browser’s Address field, so we just copied it from there. In our case, the full address to the file was not an easy read:
http://2754683763817579799-a-1802744773732722657-s-sites.googlegroups.com/site /myunique123site/vat_calculator.swf?attachauth=ANoY7cr2jhqh_4W01xmpr3_Q1bMHeTr hRxSWTZT7ZwTPhLxNkEWzvg_HANt8GfPl_5fzJTkcJHibpYm9MBIJlE3HexLMbw_hSZSC8g7rSyy3n lFg7wN0q5_tj85tVBc-gYjL0drZkPytTO6l_xPArfx5cpoY_ocFi_rMhzL2ynvSKUNy3WDDYbBnD7c x9Fiy0PazGTJFzWSKrQas8papQ1owQ_XxzJAI1A%3D%3D&attredirects=0
We had now uploaded the Flash calculator in Google Sites. We now went over to Blogger and logged in to our account there.
Blogger doesn’t have native support to embed Flash files. Instead, we pasted a few lines of HTML code into the HTML view of the web page in Blogger. You can find this code below; it’s standard code for displaying a Flash object in a web page.
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="500px" height="400px" codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab"> <param name="movie" value="<.swf file address>" /> <param name="quality" value="high" /> <param name="bgcolor" value="#869ca7" /> <param name="allowScriptAccess" value="sameDomain" /> <embed src="<.swf file address>" quality="high" bgcolor="#869ca7" width="500px" height="400px" align="middle" play="true" loop="false" quality="high" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer"> </embed> </object>
If you follow this tutorial, you must replace all the underlined text above with your own parameters. You must provide three values: the address of the Flash file that you uploaded (in two places above) and the width and height of the Flash object (in two places above) to avoid scrolling.
Here’s what the Blogger post looked like when we were done:
We then saved the new page in Blogger.
We opened the web page in a browser and tested the calculator – it worked great. For every new value we entered into the Price field, it automatically calculated new amounts for VAT and Price, just like Excel.
SpreadsheetConverter can publish almost any Excel calculator, chart, spreadsheet or electronic form on the web. For more examples, visit our Examples library.