Insérer un tableau Google dans une page de son site web

Insérer un tableau Google dans une page de son site web

Vous souhaitez intégrer sur votre site un tableau dynamique qui ressemble à votre tableur excel ou openoffice ? C'est possible grâce au service Google Document (Drive). Grâce au service "Calc", vous pouvez créer un tableau et l'insérer sur votre site

Condition préalable : avoir un compte sur Google.

 

Ajouter le document sur Google Doc

Rendez-vous sur Google Drive: https://docs.google.com

En haut à gauche de l'interface se trouve un bouton qui va vous permettre d'importer votre tableau existant (créé avec Excel ou OpenCalc).

Cliquez-donc sur le bouton importer.

bouton-importer-googledoc.jpg

Choisissez votre fichier et cochez la case à cocher Convertir les documents texte, présentations, feuilles de calcul et dessins au format Google Documents correspondant.

Une fois importé, vous retrouverez le fichier dans la liste des fichiers sur la page d'accueil de Google Doc.

 

tableau-excel-googledoc.jpg

 

Publier le document

Ouvrez le document que vous venez d'importer sur Google Doc. 

  • Allez ensuite dans Fichier puis Partager.
  • Cliquez sur le choix Publier sur le web.
  • Puis cliquez sur Intégrer puis Publier.

Vous avez alors un code ressemblant à celui-ci que vous pouvez copier: 
<iframe width='500' height='300' frameborder='0' src='https://docs.google.com/spreadsheet/pub?key=0AoU-MECMPsDUdG5ndm05N2w1Q1JOVHpIenNNN3EwMHc&output=html&widget=true'></iframe>

Une fois le code copié, vous pouvez fermer cette fenêtre.

Mettre le document en ligne sur votre page

Maintenant que vous avez récupéré le code HTML de votre tableau Google Doc, vous pouvez  l'ajouter dans votre page.

Grâce à l'outil de création de page, vous pouvez ajouter une ligne contenant un widget Code HTML (ou passer en mode HTML si vous utilisez le widget Editeur visuel).

Collez alors la portion de code copiée plus haut dans l'éditeur HTML. Vous pouvez modifier la largeur et la hauteur de votre document pour qu'il s'intègre parfaitement dans votre page (width='500' height='300')

Enregistrez votre page. Dans votre éditeur de page, vous ne verrez pas le contenu du tableau, rendez-vous sur votre site pour voir le résultat.