Zenamu propose un script qui vous permet d’afficher votre planning de cours directement sur votre site web. Votre site affiche le planning dans la vue choisie sous Affichage du planning (voir Comment choisir l’affichage du planning intégré ? plus bas). Le planning est entièrement responsive (il s’adapte automatiquement à la largeur des écrans et appareils) et fonctionne avec les autres éléments de votre page.
L’intégration est simple et ne prend pas plus de 5 minutes. Il suffit de copier un petit extrait de code et de le coller dans votre site. Des connaissances de base en HTML et en JavaScript sont nécessaires (nous recommandons de le faire avec votre webmaster).
Si vous utilisez un CMS, l’intégration est également possible. Consultez nos tutoriels pour Webnode, WordPress et Wix.com.
Étapes pour l’intégration du planning sur votre site
1. Ajouter le script
Deux méthodes sont possibles :
a. Dans l’en-tête de la page HTML (<head>)
Insérez ce code dans la balise <head>. N’oubliez pas l’attribut defer, sinon le planning ne s’affichera pas.
Planning des cours
<script defer src="https://zenamu.com/calendar/list.js" crossorigin></script>
Événements
<script defer src="https://zenamu.com/calendar/workshops.js" crossorigin></script>
Cycles de cours
<script defer src="https://zenamu.com/calendar/courses.js" crossorigin></script>
b. À la fin de la page HTML (avant </body>)
Vous pouvez aussi coller le script juste avant </body> :
Planning des cours
<script src="https://zenamu.com/calendar/list.js" crossorigin></script>
Événements
<script src="https://zenamu.com/calendar/workshops.js" crossorigin></script>
Cycles de cours
<script src="https://zenamu.com/calendar/courses.js" crossorigin></script>
2. Ajouter l’élément HTML
Ajoutez ce <div> à l’endroit de la page où vous voulez afficher le planning :
Planning des cours
<div id="zenamu-calendar" calendar-id="[your calendar ID]"></div>
Événements
<div id="zenamu-workshops" calendar-id="[your calendar ID]"></div>
Cycles de cours
<div id="zenamu-courses" calendar-id="[your calendar ID]"></div>
Remplacez [your calendar ID] par votre identifiant unique, que vous trouverez dans votre espace d’administration Zenamu.
Vous pouvez copier le code complet, avec votre identifiant de calendrier déjà renseigné, dans votre espace d’administration : allez dans Paramètres > Page du planning, ouvrez l’onglet Planning public et, dans Widgets pour votre site web, dépliez Planning des cours, Événements ou Cycles. La même section contient aussi le code d’un widget Rendez-vous individuels.
3. C’est prêt !
Votre site affichera un planning ressemblant à ceci :
Événements
Cycles de cours
Comment choisir l’affichage du planning intégré ?
Le code du planning est le même pour tous les affichages. L’affichage se règle dans Zenamu :
Allez dans Paramètres > Page du planning et ouvrez l’onglet Planning public.
Dans Widgets pour votre site web, dépliez Planning des cours.
Sous Affichage du planning, cliquez sur Planning hebdomadaire des cours, Liste des 30 prochains cours ou Liste hebdomadaire. Zenamu enregistre votre choix immédiatement, et vous n’avez pas besoin de modifier le code de votre site.
L’affichage en liste n’est pas limité à 30 jours : il présente vos prochains cours par groupes de 30, et les visiteurs peuvent en charger davantage. Les visiteurs peuvent aussi passer à un autre affichage dans le planning.