Comment intégrer un PDF dans une page HTML ?

Le langage HTML propose des balises permettant d'afficher un contenu qui n'est pas du HTML. Les voici.

Il est aujourd'hui possible d'afficher un document PDF dans une page Web. Pour cela, deux solutions : utiliser des balises HTML conçues pour cet usage ou alors faire appel à des librairies ou des sites externes.

Le langage HTML propose des balises permettant d'afficher un contenu qui n'est pas du HTML. La balise peut être utilisée pour cet usage. On précise l'emplacement du fichier dans l'attribut src. Il est important d'indiquer le type de l'objet dans l'attribut type afin que le plugin d'affichage du navigateur s'active, sinon ce dernier pourrait simplement proposer ce fichier en téléchargement.

<embed src=http://monsite.fr/monfichier.pdf width=800 height=500 type='application/pdf'/>

Cette balise est supportée par la majorité des navigateurs. Une autre solution possible est la balise . Elle est plus ancienne que la balise (cette dernière n'est considérée valide que dans le HTML5). En outre, elle peut gérer les cas où le contenu ne s'affiche pas. Ce sera le contenu situé à l'intérieur de la balise qui sera affiché.

 Téléchargez le fichier PDF ici : monfichier.pdf

Il est également possible de faire appel à des services externes pour afficher un PDF. Google fournit un lecteur PDF online, Google PDF Viewer. Il suffit pour cela d'utiliser la balise avec comme attribut src l'URL http://docs.google.com/gview?url=, le lien vers le PDF et le paramètre &embedded=true qui précise que le lecteur PDF doit être intégré dans une page Web. Si vous affichez un PDF situé dans vos documents sur Google docs, vous pouvez même choisir un niveau d'autorisation entre public pour que tout le monde puisse consulter le document, sign-in required qui restreint l'accès aux personnes connectées avec leur compte Google ayant le droit d'afficher le fichier, ou private pour être la seule personne autorisée. La limite de cette solution pour un fichier PDF est une taille maximum de 10 pages et 10 Mo.

Il existe également la librairie externe PDF.js. Elle est disponible à cette adresse. Elle permet d'afficher un PDF avec un lecteur utilisant intégralement du code JavaScript.

HTML/CSS

Annonces Google