Philips AmbiLux

This page explains step by step how to embed the AmbiLux-iframe onto your own website.

Intro

In its simplest form, this is how embedding the AmbiLux-iframe works:

add a placeholder to your HTML file.
include the AmbiLux javascript file from the www.ambilux.philips.com domain
add javascript code to your webpage to initiate the embedding of the AmbiLux-iframe

The script will write an iframe in the placeholder which holds the AmbiLux markup and code. All the assets are loaded from the www.ambilux.philips.com domain.

Add a placeholder in your HTML file

Add a placeholder in your HTML file. You will need the ID of the placeholder later when you add the javascript.

<div id="mblx"></div>

Include the AmbiLux script

Add a script-tag to your page that refers to the javascript file on the www.ambilux.philips.com domain.

<script src="http://ambilux.philips.com/content/js/distr/ambilux.1.0.0.js"></script>

Initiate the creation

Add the following code to your HTML.

id: this is the ID of your placeholder div
Choose the language (list of available languages below)

<script type="text/javascript">
    window.onload = function(){
        var alux = new Ambilux({
            id: 'mblx',
            lang: 'en-gb'
        });
    }
</script>

You're done

If you're page is responsive, please also include the div-element you've added into your css-code. The iframe is set to keep 100% width inside that div and will scale along with the div. Don't add a height to the div. The iframe itself with adjust it's height to the height of the content (using javascript)

This is what your code should look like:

<!doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <title>Philips AmbiLux Example</title>
    </head>
    <body>
        <div id="mblx"></div>

        <script src="http://ambilux.philips.com/content/js/distr/ambilux.1.0.0.js"></script>
        <script>
            window.onload = function(){
                var alux = new Ambilux({
                    id: 'mblx',
                    lang: 'global-en'
                });
            }
        </script>
    </body>
</html>

Available Languages

Country	Language	Parameter
Global(default)	English(default)	global_en
Belgium	French	be_fr
Belgium	Dutch	be_nl
Bulgaria	Bulgarian	bg_bg
Croatia	Croatian	hr_hr
Czech Republic	Cezch	cz_cs
Estonia	Estonian	ee_et
France	French	fr_fr
Germany	German	de_de
Lithuania	Lithuanian	lt_lt
Netherlands	Dutch	nl_nl
Norway	Norwegian	no_no
Poland	Polish	pl_pl
Romania	Romanian	ro_ro
Slovakia	Slovak	sk_sk
Slovenia	Slovenian	si_sl
Sweden	Swedish	se_sv
Turkey	Turkish	tr_tr