Accueil > Boîte à outils > Tuto : comment intégrer et visualiser un PDF dans esidoc

Tuto : comment intégrer et visualiser un PDF dans esidoc

Pour permettre aux élèves de visualiser et lire un document directement dans esidoc, sans avoir à le télécharger ou à ouvrir un nouvel onglet, j’utilise Google drive.

  • Stocker un PDF sur Drive

PDFesidoc2Google Drive est à la fois un espace de stockage en ligne (cloud) et une suite bureautique (éditeur de texte, tableur, diaporama…), accessible pour toute personne ayant un compte Gmail. Vous pouvez donc créer votre document directement dans Drive ou alors importer un document que vous avez créé en local avec votre logiciel préféré (au format .doc, .docx, .dot, .pdf, etc.)

  • Partager la visibilité du document

Une fois le document enregistré, il suffit de cliquer sur le bouton bleu, en haut à droite « partager » ou (dans le cas d’un document importé) de faire un clic droit, puis « partager ». Dans le cadre qui s’ouvre, optez pour une visibilité par toute personne possédant le lien de partage. Copiez l’identifiant public du document (ici souligné en vert).

  • Intégrer dans esidoc le document

Dans esidoc, passez en mode html, puis copiez-collez le code suivant :

<iframe src="https://docs.google.com/viewer?srcid=0B3Y7gmhx2ih7S2Y3SUNWZDJsbjA&pid=explorer&efh=false&a=v&chrome=false&embedded=true" height="800px" width="100%"></iframe>

Remplacez le code unique du document (en vert) par le vôtre.

Vous pouvez adapter la hauteur du document en modifiant le critère « height » (en rose).

Enregistrez.

  • Le résultat

Le document est visible en entier. Un curseur permet de lire l’ensemble du document.

PDFesidoc1

Catégories :Boîte à outils Étiquettes : ,
  1. septembre 28, 2016 à 09:24

    Bonjour
    Merci pour tous vos tutos, j’ai suivi exactement la procédure en remplaçant le code vert par celui de mon document, mais à l’enregistrement dans e-sidoc, la page demeure blanche ? Pouvez-vous m’éclairer?

    A bientôt

    J’aime

  2. MJulliant
    octobre 25, 2016 à 15:48

    Bonjour,
    j’ai eu le même problème lors de l’enregistrement : page blanche.
    Merci de votre réponse et pour tout ce travail !

    Mélanie

    J’aime

    • octobre 28, 2016 à 17:45

      Bonjour,
      Etes-vous certaine d’avoir bien partagé le document ? Si oui, envoyez-moi une copie du lien du document partagé. J’essaierai sur l’esidoc de mon établissement et vous renverrai le code.

      J’aime

  3. Karine P.
    avril 28, 2017 à 12:58

    Merci pour votre travail. Grâce à vous mon Esidoc prend de l’ampleur. Et dire que je croyais qu’intégrer un PDF n’était pas possible!

    J’aime

  4. Berthet- Godani Marielle
    mars 6, 2018 à 12:01

    Bonjour, j’ai le même problème que les collègues, au moment de l’intégration du lien j’obtiens une page blanche. mais je précise que je ne passe pas par drive mais par le cloud académique. je vous mets le lien ci dessous
    https://cloud-aca.ac-besancon.fr/index.php/s/0mv3TdLFuYvlXM8
    Merci de votre aide

    J’aime

    • mars 16, 2018 à 11:29

      Bonjour,
      Je voulais vous proposer une solution, mais en ce moment le cloud de votre académie est en maintenance. Je ne peux donc pas vérifier par moi-même si le code est bon.
      Je vous propose donc d’essayer ultérieurement le code suivant, à copier-coller dans l’éditeur HTML de l’article ou la rubrique d’esidoc :

      <iframe src="https://cloud-aca.ac-besancon.fr/index.php/s/0mv3TdLFuYvlXM8&quot; width="100%" frameborder="0"></iframe>

      J’aime

    • mars 16, 2018 à 11:45

      Si cela ne fonctionne toujours pas, une solution serait d’héberger votre pdf sur Google Drive et suivre la méthode décrite plus haut dans l’article.

      J’aime

  5. Groupe scolaire des Servites de Marie - Collège Saint Louis
    novembre 8, 2018 à 15:01

    Bonjour, merci pour ce tuto bien pratique, mais comme les collègues dans les commentaires précédents, je me retrouve avec une page blanche…avec votre code html ça marche, avec le mien non…gggrrr
    Merci d’avance pour votre aide !

    J’aime

    • décembre 19, 2018 à 19:11

      Bonjour,
      Désolée du délai de réponse. Si vous rencontrez toujours ce problème, j’ai besoin que vous me fournissiez l’URL du document partagé, hébergé sur Google drive pour faire des tests.

      J’aime

  6. beaubois
    mars 3, 2019 à 16:45

    Bonjour,
    j’ai intégré un pdf il y a quelque temps grâce à votre code.
    Mais aujourd’hui il ne semble plus actif
    Pouvez-vous me le redonner ?
    Cordialement
    bb

    J’aime

    • mars 13, 2019 à 11:32

      Bonjour,
      Effectivement, le code avait été partiellement effacé. Je l’ai remis. Je viens de tester sur l’esidoc du collège. Ca fonctionne. En est-il de même de votre côté ?

      J’aime

  7. juin 9, 2020 à 16:50

    Bonjour,
    Merci beaucoup pour toutes les informations que vous partagez !
    Grâce à vos explications j’ai pu intégrer des documents intéressants sur E-sidoc. Cependant, il semblerait qu’avec une version récente de Firefox, cela ne semble plus fonctionner…
    En effet, après la manipulation, le message suivant apparaît dans la fenêtre E-sidoc:  » Bloqué par la politique X-Frame-Options. Une erreur est survenue pendant une connexion à drive.google.com. Firefox a empêché le chargement de cette page dans ce contexte car la politique X-Frame-Options de la page ne l’autorise pas ».
    Savez-vous comment résoudre ce problème ?
    Merci beaucoup pour votre éclairage 🙂

    J’aime

  8. novembre 6, 2020 à 10:10

    Bonjour, tout d’abord merci pour votre tuto. J’ai suivi votre procédure à la lettre mais rien ne s’affiche. Pouvez vous m’aider ? Voici le lien de mon document sur mon drive :

    https://drive.google.com/file/d/1brS1plKKRXSbtwAG4GPhC5g5oeTCEh3o/view?usp=sharing
    J’ai essayé de remplacer tout ce que vous avez mis en vert par cette adresse mais rien ne s’affiche 😦

    Merci !

    J’aime

  1. No trackbacks yet.

Laisser un commentaire