| |
Formation 10 - Le site école Spip de la DSI
Bandeau
Formation 10 - Le site école Spip de la DSI
Le site école Spip de la DSI

Le site école d’information et d’aide à la gestion de votre site Spip dans l’académie Orléans-Tours dédié aux webmestres, administrateurs, rédacteurs

Ajouter des Api Google
Article mis en ligne le 8 mars 2017
dernière modification le 9 mars 2023

par Admin_dsi

Ajouter un QR-Code simplement
Ce QR-Code suivant permet de télécharger un fichier pdf.

Pour afficher ce QR-Code, il faut connaître l’URL (le chemin) du fichier... Cela pourrait être un simple lien vers un autre site, une autre page, une image, une vidéo...
Ensuite, il suffit de scanner le code avec un smartphone, une tablette...
Le code suivant décrit la création du QR-Code à partir d’une API Google Chart :

<img src="https://chart.googleapis.com/chart?cht=qr&chs=150x150&chl=http://formation10.tice.ac-orleans-tours.fr/eva/sites/formation10/IMG/pdf/montee_de_version_spip_3.2.pdf"/>

cht=qr permet de définir qu’il s’agit d’un QR-Code,
chs=150x150 détermine les dimensions du QR-Code,
chl=http://.... détermine l’URL qui sera suivie lors du scan.

Insertion d’API (Application Programming Interface) Google Map, Google Calendar

Sans clé :
- Se rendre sur le site de google map : www.google.fr/maps
- Localiser le lieu - Accéder au menu au haut à gauche, à côté de la zone de recherche
- Cliquer sur le lien ’Partager ou intégrer une carte
- Dans la boite de dialogue, onglet ’Intégrer la carte
- Choisir la taille de l’image et copier le code <iframe....></iframe....>
- Et le coller dans l’article

Avec une clé :
La clé API sert à la fois d’identifiant unique et de jeton secret pour l’authentification et un ensemble de droits d’accès lui est associé.
« Votre clé vous permet de surveiller l’utilisation de Maps API par votre application et permet à Google de vous contacter à propos de votre site Web ou de votre application, le cas échéant. « developers.google.com »

- Créer un compte sur accounts.google : accounts.google.com
- Créez ou sélectionnez un projet.
- Cliquez sur Continue pour activer l’API.
- Sélectionnez Go to Credentials pour obtenir une clé de serveur (Server key) (et définir les informations d’identification de l’API).
- Récupérer votre clé
- Aller sur developers.google.com/maps
- Choisir ’Je veux...’
- Recopier le code ( sous la carte ) <iframe...></iframe...> et le coller dans votre article.
- Renseigner la valeur de key (...&key=...)

Google calendar
- Avoir préalablement un compte
- Se connecter sur accounts.google.com
- Dans le menu ’Mes agendas’, sélectionner ’Créer un agenda’ en déroulant le sous-menu
- Renseigner les différents champs et créer l’agenda
- Dans les Paramètres (icône roue crantée), aller dans le menu Paramètres
- Cliquer sur le lien ’Agendas’ en haut à gauche
- Sélectionner l’agenda et recopier le code de la partie ’Intégrer cet agenda’ dans votre article

<iframe src="https://calendar.google.com/calendar/embed?src=codefourni%40group.calendar.google.com&ctz=Europe/Paris" style="border: 1" width="400" height="300" frameborder="0" scrolling="no"></iframe>

- Vous pouvez personnaliser l’agenda, cliquer sur ’Personnaliser la couleur, la taille et d’autres options’
- Les ajouts, modifications d’événements se font depuis l’interface calendar.google.com