Vizualis, celovite vizualne rešitve, d.o.o., Veliki Gaber 74, 8213 Veliki Gaber, pisarna: Mušičeva 15, 8000 Novo mesto, tel.: +386 (0)590 48068, tel/faks: +386 (0)7 30 46 441, e-pošta: info@vizualis.si
Guide for installing Konfigurator on a website Purpose This guide provides relevent information on Embeding Konfigurator on webpage.
Introduction Konfigurator is FLEX (Flash) web application or Apache Flex application (http://flex.apache.org). Like every other Flash application Konfigurator has to be embeded into HTML of a webpage using specific embed codes. There are at least two methods : • Using generic JavaScript Embedder like SWFObject • Using HTML tag (like <object> or <embed>) Which means that Konfigurator is instlled into the site following the standard procedure to install Flash web applications. We recommend using SWFObject, since it works in all browsers and many examples exist on the web to get you up and running quickly.
Installation with SWFObject SWFObject is the most widely used method for embedding Flash / Flex applications. It has excellent documentation: http://code.google.com/p/swfobject/wiki/documentation Before embedding Konfigurator on the page, make sure to include swfobject.js in the <HEAD> of your HTML. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"> </script>
With the library set up, you can start embedding Konfigurator. Here is an example: <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"> </script> <script type="text/javascript"> var xiSwfUrlStr = "http://static.konfigurator.si/client/playerProductInstall.swf"; var flashvars = { key : "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", lang : "de" }; var params = { quality : "high", bgcolor : "#ffffff", allowscriptaccess : "always", allowfullscreen : "true" }; var attributes = { id : "konfigurator", name : "konfigurator", align : "middle" }; var konfiguratorURL = "http://static.konfigurator.si/client/kclient.swf”; swfobject.embedSWF(konfiguratorURL,"container", "1000", "680",”10.2.0”, xiSwfUrlStr, flashvars, params, attributes);
1/3 VPIS PRI OKROŽNEM SODIŠČU V NOVEM MESTU, ŠT. REG. VL. 1/04957/00, OSN. KAPITAL 10.000 EUR, MAT. ŠT. 2239914, ID za DDV SI26533456, TRR RAČ. 03150-1000423349 pri SKB
Vizualis, celovite vizualne rešitve, d.o.o., Veliki Gaber 74, 8213 Veliki Gaber, pisarna: Mušičeva 15, 8000 Novo mesto, tel.: +386 (0)590 48068, tel/faks: +386 (0)7 30 46 441, e-pošta: info@vizualis.si
</script> </head <body> <div id=”container”>Please install the Flash plugin.</div> </body
It is a quite some code that contains: • HTML element (“container”) • flashvars • params • attributes • konfiguratorURL • instantiation Let's walk through them one by one: •
“container” is HTML element where Konfigurator will be placed into. It should be block-level element, like a <p> or <div>. If a user has sufficient version of Flash, the text inside the container will be removed and replaced by the Konfigurator. Otherwise, the contents of the container will remain visible.
•
flashvars is list of Konfigurator configuration options. ◦ key: At this point there should always be key option. This is mandatory information, without which Konfigurator does not work. It is assigned to you when you are registered with Konfigurator. On the basis of this key Konfigurator displays data and sends inquiry/demands to your e-mail address.
◦
◦
For you to get a key we need: ▪ E-mail address (where to send inquiry) – can be more than one. ▪ Website URL – where Konfigurator will be installed. lang (optional): It tells in which language Konfigurator will be shown. If you do not specify value default language will be used. Available languages are (codes): si, en, de, hr, it, fr, cz, sk, rs. This parameter can be set dinamically (e.g. PHP, Java, ...). This way you can control Konfigurator language based on what language is selected on the website. showHeader (optional, type:Boolean, default: true): If false Konfigurator header will be hidden.
•
params object includes Flash plugin parameters. It is recommended that is always enabled fullScreen and JavaScript functionality of Flash.
•
The attributes object includes HTML attributes of the Konfigurator. We recommend always setting id and name to the same value. This will be the id of Konfigurator instance.
•
konfiguratorURL is URL address where Konfigurator is located. This file should be always loaded from this address.
•
Instantiation is where all things come together and the actual Konfigurator embedding takes place. These are all parameters of the embedSWF call: ◦ ◦
The Konfigurator URL address The ID of HTML element (container) where Konfigurator will be placed
2/3 VPIS PRI OKROŽNEM SODIŠČU V NOVEM MESTU, ŠT. REG. VL. 1/04957/00, OSN. KAPITAL 10.000 EUR, MAT. ŠT. 2239914, ID za DDV SI26533456, TRR RAČ. 03150-1000423349 pri SKB
Vizualis, celovite vizualne rešitve, d.o.o., Veliki Gaber 74, 8213 Veliki Gaber, pisarna: Mušičeva 15, 8000 Novo mesto, tel.: +386 (0)590 48068, tel/faks: +386 (0)7 30 46 441, e-pošta: info@vizualis.si
◦ ◦ ◦ ◦
◦
Konfigurator width (should be 1000) Konfigurator height (should be 680) The required version of Flash player The location of Flash auto-upgrade script Next we have flashvars, params and attributes
Requirements for installation To install Konfigurator on the website does not require any additional software or hardware.
For any additional information please contact info@konfigurator.si.
3/3 VPIS PRI OKROŽNEM SODIŠČU V NOVEM MESTU, ŠT. REG. VL. 1/04957/00, OSN. KAPITAL 10.000 EUR, MAT. ŠT. 2239914, ID za DDV SI26533456, TRR RAČ. 03150-1000423349 pri SKB