Passer au contenu principal

Intégrer un document Calameo sur Wobee

Ce guide explique comment insérer un document Calaméo (planning, brochure, etc.) dans un module Wobee de façon à ce qu'il s'affiche correctement, sans être coupé ni trop petit.

Écrit par Janelle Chevreau

1️⃣ Étape 1 : Récupérer le code d'intégration sur Calaméo

  1. Ouvrez votre document sur Calaméo (calameo.com).

  2. Cliquez sur l'icône de partage (la flèche) en haut de la visionneuse.

  3. Dans le menu qui s'ouvre, cliquez sur « Copier le code d'intégration » (icône </>).

Ce code est automatiquement copié dans le presse-papiers. Il n'y a rien d'autre à récupérer sur la page Calaméo.

2️⃣ Étape 2 : Coller le code dans Wobee

  1. Dans le module Wobee concerné, ajoutez un bloc de type « HTML » (et non un champ « iframe »).

  2. Collez-y le code copié à l'étape précédente, sans le modifier pour l'instant.

À ce stade, l'aperçu risque de s'afficher en tout petit format : c'est normal, il reste un réglage à faire.

3️⃣ Étape 3 : Ajuster la taille d'affichage

Le code fourni par Calaméo intègre une iframe dimensionnée pour un petit aperçu (environ 300 x 194 pixels), pensée pour un site web classique, pas pour une lecture confortable dans Wobee. Il faut donc modifier deux attributs dans le code collé :

  • width : remplacer la valeur par 100% pour que le document occupe toute la largeur disponible.

  • height : remplacer la valeur par une hauteur suffisante pour afficher tout le document sans zone coupée (par exemple entre 800 et 1500 selon le nombre de pages du document).

Ces deux valeurs se trouvent dans la balise « iframe » du code, juste après src="…".

4️⃣ Étape 4 : Vérifier l'affichage

  1. Enregistrez le module et prévisualisez la page.

  2. Si le document est coupé en bas, augmentez la valeur de height. S'il reste un grand espace vide sous le document, réduisez-la.

Une fois la bonne hauteur trouvée, elle peut être réutilisée pour un document de longueur similaire.

Points de vigilance

  • Ne pas coller l'adresse de la page Calaméo (celle du navigateur) directement dans un champ « iframe » : elle est bloquée par Calaméo et ne s'affichera pas.

  • Toujours utiliser le code fourni par « Copier le code d'intégration », qui contient la bonne adresse technique du lecteur.

  • Chaque nouveau document Calaméo nécessite de recommencer ces étapes : le code d'intégration est propre à chaque document.

Avez-vous trouvé la réponse à votre question ?