Friday, January 23, 2009

Weerbericht / Météo Widgets

Eigenschappen van deze widget
Gebruik
Om het weerbericht van de vorige of de volgende dag te zien klik je op previous of next.

Je kan deze widget toevoegen aan je iGoogle pagina of insluiten in een webpagina.
De Google homepage van deze widget vind je hier
Toepassing
Indien gewenst vervangen wij ons logo onderaan door jouw logo. Zo verkrijg je je eigen, gepersonaliseerde widget die je op je blog of website kan plaatsen en zelf kan beginnen verspreiden.
Werking
Een server applicatie zorgt ervoor dat een dagelijkse kopij wordt genomen van het weerbericht dat door de BDB zowel in het Nederlands als in het Frans wordt gepubliceerd. Ook op de server, zorgt een automatisch proces ervoor dat deze html pagina die oorspronkelijk in tabelvorm werd opgesteld volledig wordt ontleed en terug wordt samengesteld in een universeel bruikbaar dataformaat, in dit geval XML.
Aan de voorzijde van de widget zorgt een JavaScript ervoor dat de HTML structuur van de widget wordt opgebouwd en dat de data d.m.v. een asynchrone (AJAX) aanvraag wordt opgehaald van de server. Tenslotte wordt deze XML data doorlopen en geïnjecteerd in de HTML code. De knoppen waarmee naar links en rechts wordt genavigeerd voeren op hun beurt ook weer JavaScript opdrachten uit waarmee bepaalde zichtbare blokken worden verborgen terwijl andere juist wel zichtbaar worden gemaakt.
Technologie Server
Technologie Widget
Bron van de data
De Bodemkundige Dienst van België vzw
The Widgetbox

Deze widget is ook beschikbaar op widgetbox waar je zelf heel eenvoudig de code kan ophalen voor publicatie van deze widget op Blogger, TypePad, WordPress, Netvibes, Pageflakes, enz

Beurskoersen Widgets

Eigenschappen van deze widget
Gebruik
Om het koersverloop van een andere onderliggende waarde te zien, klik je bovenaan de widget op de naam van de actuele onderliggende waarde en kies je je nieuwe aandeel of index door op de gewenste link te klikken in de lijst die je nu te zien krijgt.
Opmerking: Deze widget maakt gebruik van een zeer nieuwe technologie waarbij de (Flash) grafieken, 'on the fly' worden opgemaakt door het uitvoeren van JavaScript functies. Er is nog heel wat werk aan de winkel wanneer je ziet dat de grafieken soms verdwijnen bij het scrollen. Het ligt in onze bedoeling om binnenkort deze technologie te vervangen door pure JavaScript waardoor de widget veel stabieler zal worden.
Je kan deze widget toevoegen aan je iGoogle pagina of insluiten in een webpagina.
De Google homepage van deze widget vind je hier
Toepassing
Indien gewenst vervangen wij ons logo onderaan door jouw logo. Zo verkrijg je je eigen, gepersonaliseerde widget die je op je blog of website kan plaatsen en zelf kan beginnen verspreiden.
Werking
Een server applicatie zorgt ervoor dat bij elke nieuwe aanvraag een heel complex xml object wordt opgehaald bij Yahoo finance dat vervolgens wordt omgezet in een veel eenvoudiger JSON object dat naar de widget wordt doorgestuurd.
Aan de voorzijde van de widget zorgt een JavaScript ervoor dat de HTML structuur van de widget wordt opgebouwd en dat de juiste JSON data d.m.v. een asynchrone (AJAX) aanvraag wordt opgehaald van de server. Tenslotte wordt de data in dit JSON object doorlopen en geïnjecteerd in de HTML code. De knoppen waarmee naar links en rechts wordt genavigeerd voeren op hun beurt ook weer JavaScript opdrachten uit waarmee bepaalde zichtbare blokken worden verborgen terwijl andere juist wel zichtbaar worden gemaakt.
Technologie Server
Technologie Widget
Bron van de data

Thursday, January 22, 2009

Widgets insluiten in je eigen webpagina

Een Google widget aan je eigen webpagina of blog toevoegen doe je in drie eenvoudige stappen.
  1. Eerst ga je best op zoek naar de 'homepage' van de widget die je wil inbedden, en klik je daar op de "Deze gadget insluiten" link.
  2. Vervolgens pas je op deze pagina de instellingen van de widget aan zoals o.a. de hoogte, de breedte en de kader en wanneer je tevreden bent over het resultaat klik je op de "Code ophalen" knop.
  3. Tenslotte kopiëer je de gegenereerde code die je nu om het even waar in elke webpagina of blog pagina moet plakken om de widget op die plaats zichtbaar te maken.
Via deze blog vind je bij elke widget een "Inbedden" link die je onmiddellijk naar de pagina doorverwijst waar je je widget kan personaliseren (stap 2).

Stap voor stap

1. Leuke widgets vinden:
Ga naar de 'Gadgets Directory' kies een leuke widget uit en klik de "Toevoegen aan uw webpagina" link.

2. Je gekozen widget personaliseren:

3. De code:

Widgets toevoegen aan iGoogle

Een nieuwe widget aan je gepersonaliseerde Google pagina toevoegen is heel eenvoudig. Eerst klik je op  waardoor je naar onderstaande pagina wordt doorverwezen ...



Klik nu gewoon op de 'Toevoegen aan Google' knop en de widget verschijnt op je iGoogle pagina wanneer je deze opnieuw laadt.