Google Web Elements
Google Web Elements, se sont des objets intégrables de Google. Pour y accèder, connectez-vous sous votre compte Google, puis rendez vous à l'adresse Google Web Elements.
Sommaire
Un Diaporama (Presentations)
Google Documents permet d'enregistrer un diaporama. Celle-ci peut être affichée à l'aide de l'élément Présentation
Paramètres : L'adresse de la présentation et la taille désirée.
Exemple : Les vins du Valais en Chine
Le code à insérer dans le html du message ou dans un gadget HTML/Javascript :
<iframe frameborder="0" marginwidth="0" marginheight="0" border="0" style="border:0;margin:0;width:410px;height:342px;" src="http://docs.google.com/present/embed?id=0AYyfJJJSNrfuZGRiZzZid2dfMTI0aG52eG03Zno&element=true" scrolling="no" allowtransparency="true">Google Web Elements - Presentation</iframe>
Note : La Présentation est dans un format propre à Google Document. Pour afficher une présentation Power-Point originale, il est possible d'utiliser le lecteur de documents de Google Documents.
Une feuille de calcul (Spreadsheets)
Une feuille de calcul enregistrée sur Google Documents peut être affichée sur le Blog, à l'aide de l'élément Feuille de calcul (Spreadsheets).
Paramètres : L'adresse (URL) de la feuille de calcul, la taille et la plage de cellules à afficher.
Exemple : Encépagement en cépages rouge du Canton de Vaud (2008).
Le code à insérer dans le html du message ou dans un gadget HTML/Javascript :
<iframe frameborder="0" marginwidth="0" marginheight="0" border="0" style="border:0;margin:0;width:600px;height:500px;" src="http://spreadsheets.google.com/pub?output=html&widget=true&single=true&element=true&gid=0&key=0AoyfJJJSNrfudE5naDVYNWY4YkxQbTZ6WkJSR1NhYXc" scrolling="no" allowtransparency="true">Google Web Elements - Spreadsheets</iframe>
Un Moteur de Recherche Personnalisé (Custom Search)
L'élément Recherche Personnalisée offre une façon simple d'ajouter un formulaire de recherche sur son Blog. Trois options sont offertes, la recherche sur le Blog, la recherche sur le Blog en permettant l'affichage de publicités AdSense dans le résultat de la recherche, ou l'utilisation d'un moteur de recherche personnalisé (Custom Search Engine - CSE).
Paramètres : Le type de moteur de recherche et le style du formulaire.
Exemple : Le moteur de recherche des Liens du Vin.
La petite croix après le bouton de recherche permet d'effacer le résultat de la recherche.
Loading
Le code à insérer dans un gadget HTML / Javascript est un script. Pour le placer dans le html du message, utilisez le code suivant en remplacant le code de la recherche personnalisée. Saisir le code sans retour à la ligne !
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript"> google.load('search', '1'); google.setOnLoadCallback(function(){ new google.search.CustomSearchControl('partner-pub-5518142162212860:9e4v2y-mjl7').draw('cse'); }, true); </script><noscript>Google Web Elements - Custom Search</noscript>
Recherche d'Actualités (News)
L'élément Recherche d'actualité permet d'afficher les dernières informations sur un sujet donné.
Paramètres : Le format et l'expression à rechercher.
Exemple : Une recherche d'Actualités sur Google Blogger.
Le code à insérer dans le html du message ou dans un gadget HTML/Javascript :
<iframe frameborder="0" marginwidth="0" marginheight="0" border="0" style="border:0;margin:0;width:300px;height:250px;" src="http://www.google.com/uds/modules/elements/newsshow/iframe.html?rsz=large&format=300x250&q=Google%20Blogger&element=true" scrolling="no" allowtransparency="true">Google Web Elements - News</iframe>
Un lecteur de Flux (Reader)
Google Reader, le lecteur de flux de Google permet d'afficher les flux RSS que l on désire suivre. Google Reader permet aussi d'afficher un extrait de ses abonnements sur son Blog. De nombreux Gadgets Google permettent aussi d'afficher un flux sur son Blog. L'élement Reader de Google Web Elements permet d'insérer un extrait des flux partagés sur son Blog.
Paramètres : Le titre de l'élément, le style et le nombre d'entrées à afficher.
Exemple : Mes tags partagés (trucs et astuces pour Blogger).
Le code à insérer dans un gadget HTML/Javascript est un script. Pour le placer dans le html du message, utilisez le code suivant en remplacant les identifiants. Saisir le code sans retour à la ligne !
<div id="readershared"><div></div></div>
<script type="text/javascript">window.GRC_m=function(d){return new GRC(d,document.getElementById("readershared").firstChild);};</script>
<script type="text/javascript" src="http://www.google.com/reader/ui/publisher-en.js"></script>
<script type="text/javascript" src="http://www.google.com/reader/public/javascript/user/05980836729406198703/state/com.google/broadcast?n=7&callback=GRC_p(%7Bc%3A%22khaki%22%2Ct%3A%22Liens%20partag%C3%A9s%22%2Cs%3A%22true%22%2Cn%3A%22true%22%2Cb%3A%22false%22%2Cw%3A%22true%22%7D)%3Bnew%20GRC_m&t=?"></script><noscript>Google Web Elements - Reader</noscript>
Le Forum (Conversation)
L'élément Forum permet aux lecteurs d'intervenir directement sur le Blog, sans passer par les commentaires.
Paramètres : La taille, le sujet du forum, la portée (limitée au Blog ou ouverte sur le Web).
Exemple : Un Forum sur les Trucs et Astuces pour Blogger.
Le code à insérer dans le html du message ou dans un gadget HTML/Javascript :
<iframe frameborder="0" marginwidth="0" marginheight="0" border="0" style="border:0;margin:0;width:250px;height:440px;" src="http://www.google.com/friendconnect/discuss?scope=site&topic=Trucs%20et%20astuces%20pour%20Blogger" scrolling="no" allowtransparency="true">Google Web Elements - Conversation</iframe>
Un Agenda (Calendar)
L'élément Agenda permet d'insérer son planning sur le Blog. L'agenda doit bien entendu être déclaré comme partagé avant l'opération.
Paramètres : L'agenda à afficher, la taille et le mode d'affichage.
Exemple : Mon agenda en mode mensuel.
Le code à insérer dans le html du message ou dans un gadget HTML/Javascript :
<iframe frameborder="0" marginwidth="0" marginheight="0" border="0" style="border:0;margin:0;width:300px;height:300px;" src="http://www.google.com/calendar/embed?showTitle=0&showTabs=0&showPrint=0&showCalendars=0&wkst=1&element=true&src=philippe.chappuis%40gmail.com" scrolling="no" allowtransparency="true">Google Web Elements - Calendar</iframe>
Une Carte (Maps)
Google Maps permet de créer sa propre carte. Placer une carte sur son Blog, demande plusieurs manipulations. L'élément carte permet de géolocaliser une adresse particulière très rapidement.
Paramètres : La taille, le type de vue, l'adresse à géolocaliser et le titre du marqueur.
Exemple : Le Château de Rolle.
Le code à insérer dans le html du message ou dans un gadget HTML/Javascript, en remplacant les paramètres de la carte.
<iframe frameborder="0" marginwidth="0" marginheight="0" border="0" style="border:0;margin:0;width:300px;height:250px;" src="http://www.google.com/uds/modules/elements/mapselement/iframe.html?maptype=satellite&latlng=46.45882133672441%2C6.341278553009033&mlatlng=46.458666%2C6.341151&maddress1=Ch%C3%A2teau%20de%20Rolle&maddress2=Grand'Rue%2C%201180%20Rolle%2C%20Suisse&zoom=16&mtitle=Ch%C3%A2teau%20de%20Rolle" scrolling="no" allowtransparency="true">Google Web Elements - Maps</iframe>
Actualités sur YouTube (YouTube News)
Pour ajouter une Video de YouTube sur son Blog, il suffit d'insérer un tag html object ou d'utiliser un Gadget Google. L'élément YouTube News permet d'ajouter les dernières vidéos d'actualité.
Paramètres : Le fournisseur de News.
Exemples : Les dernières News d'Euronews.
Le code à insérer dans le html du message ou dans un gadget HTML/Javascript :
<iframe frameborder="0" marginwidth="0" marginheight="0" border="0" style="border:0;margin:0;width:300px;height:250px;" src="http://www.google.com/uds/modules/elements/videonews/iframe.html?channel=Euronews" scrolling="no" allowtransparency="true">Google Web Elements - YouTube News</iframe>
Partager sur Orkut (Orkut Share)
Orkut, le réseau social de Google, ne dispose pas d'outils permettant de créer un bouton Partager sur Orkut.
L'élément Orkut Share comble cette lacune. Il correspond à l'outil Promouvoir d'Orkut.
Paramètres : Le style du bouton, le titre de l'article, le résumé, la vignette à utiliser et l'URL de destination.
Exemple : La promotion de cet article.
Le code à insérer dans un gadget HTML/Javascript est un script. Pour le placer dans le html du message, utilisez le code suivant, à saisir le code sans retour à la ligne !
<div id="orkut_share" style="width:100%;">Promouvoir sur Orkut... </div>
<script src="http://www.google.com/jsapi" type="text/javascript"></script> <script type="text/javascript"> google.load('orkut.share', '1'); google.setOnLoadCallback(function(){ new google.orkut.share.Button({ style:google.orkut.share.Button.STYLE_MINI, title:unescape('Google%20Web%20ELements'), summary:unescape('How%20to%20add%20Google%20Web%20Elements%20on%20Your%20Site')}).draw('orkut_share'); }, true); </script><noscript>Google Web Elements - Orkut Share</noscript>
Exemple avec le bouton Orkut normal (Orkut Regular) :
La Traduction (Translate)
L'élément Traduction permet de traduire la page courante du Blog.
Paramètres : La langue de la page et le choix de l'affichage (pour tous les visiteurs ou seulement pour ceux dont la langue est différente de celle de la page).
Exemple : L'outil traduction pour cette page.
Le code à insérer dans un gadget HTML/Javascript est un script. Pour le placer dans le html du message, utilisez le code suivant, à saisir le code sans retour à la ligne !
<div id="google_translate_element" style="display:block"></div>
<script>function googleTranslateElementInit() {new google.translate.TranslateElement({pageLanguage: "fr"}, "google_translate_element");};</script>
<script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script><noscript>Google Web ELements - Translate</noscript>
