Voulez-vous ajouter une visionneuse de PDF dans WordPress ?
En embarquant des fichiers PDF sur votre site web, vous pouvez vous assurer que ces fichiers ont toujours la même mise en page, quel que soit l’appareil utilisé par l’internaute. Ces fichiers peuvent également inciter les internautes à rester plus longtemps sur votre site et ajouter de la valeur à vos utilisations.
Dans cet article, nous allons vous afficher comment ajouter une visionneuse de PDF dans WordPress.
Pourquoi avez-vous besoin d’une visionneuse de PDF dans WordPress ?
De nombreux sites utilisent des fichiers PDF pour partager des informations sur leurs services et leurs produits. Par exemple, si vous avez un site de restaurant, vous pouvez publier votre menu sous forme de PDF en ligne.
Vous pouvez toujours téléverser un PDF sur votre site, puis ajouter un lien de téléchargement dans WordPress. Cependant, ce n’est pas le meilleur compte pour les utilisateurs/utilisatrices qui souhaitent consulter rapidement un document PDF ou qui ne veulent pas télécharger le fichier complet.
Au lieu de cela, vous pouvez ajouter une visionneuse de PDF dans WordPress, puis afficher les PDF directement sur votre site. Cela permet aux internautes de voir le document sans le télécharger, ce qui est particulièrement utile pour les utilisateurs/utilisatrices de smartphones et de tablettes.
Il permet également de garder les internautes sur votre site, ce qui peut augmenter le nombre de pages vues et réduire votre taux de rebond.
Ceci étant dit, voyons comment vous pouvez facilement ajouter une visionneuse de PDF à WordPress. Utilisez simplement les liens rapides pour passer directement à la méthode que vous souhaitez utiliser :
Méthode 1 : Ajouter une visionneuse de PDF à l’aide de l’éditeur/éditrices de blocs (facile)
La manière la plus simple d’afficher des PDF sur votre site WordPress est d’utiliser le bloc Fichier intégré.
Cette méthode ne nécessite pas d’extension particulière, mais vous pouvez uniquement personnaliser la visionneuse de quelques façons. Si vous souhaitez des personnalisations et des fonctionnalités plus avancées, nous vous recommandons d’utiliser plutôt une extension WordPress.
Pour Premiers pas, il suffit d’ouvrir la page ou la publication où vous souhaitez ajouter la visionneuse PDF, puis de cliquer sur le bouton « + » pour ajouter un nouveau module.
Ensuite, commencez à taper « Fichier » et sélectionnez le bloc de droite lorsqu’il apparaît.
Si vous avez déjà téléversé votre PDF dans la bibliothèque de médias de WordPress, cliquez sur le bouton « Bibliothèque de médias ». Vous pouvez alors sélectionner le PDF que vous souhaitez embarquer.
Si vous n’avez pas encore téléversé le PDF, cliquez sur « Téléverser » et choisissez un fichier sur votre ordinateur.
WordPress choisira automatiquement une taille pour le Contenu embarqué.
Selon la taille du fichier, la vue par défaut peut ne pas afficher l’intégralité du document. Toutefois, les internautes peuvent effectuer des zooms avant et arrière et faire défiler le PDF en utilisant les paramètres de la barre d’outils.
Si vous préférez, vous pouvez modifier la hauteur de la visionneuse PDF pour afficher une partie plus ou moins importante du document embarqué.
Pour ce faire, il suffit d’utiliser le Diaporama « Hauteur en pixels » dans le menu de droite.
Il arrive que les internautes veuillent télécharger un PDF, afin de l’avoir toujours à portée de main. Par exemple, les clients/clientes peuvent vouloir télécharger le compte rendu d’utilisation de votre produit le plus populaire ou le plan personnalisé d’un évènement ou d’une conférence à venir.
Par défaut, WordPress affiche une icône « Télécharger » dans la barre d’outils et un bouton sous le PDF.
Le bouton « Télécharger » peut être utile aux internautes qui ne sont pas familiarisés avec les différentes icônes de la barre d’outils PDF.
C’est pourquoi vous pouvez laisser le bouton « Télécharger » activé. Toutefois, si vous ne souhaitez pas inclure ce contenu duplicator, vous pouvez cliquer sur le bouton « Afficher le bouton de téléchargement » pour le désactiver.
Lorsque vous êtes satisfait de la façon dont le PDF est configuré, cliquez sur « Mettre à jour » ou « Publier » pour que vos modifications soient directes.
Maintenant, si vous visitez votre site WordPress, vous verrez la visionneuse PDF en action.
Méthode 2 : Ajouter une visionneuse de PDF dans WordPress à l’aide d’une extension (plus personnalisable)
Le bloc de fichiers WordPress intégré est une bonne option si vous souhaitez simplement embarquer quelques PDF. Cependant, si vous voulez plus de contrôle sur la visionneuse, alors nous recommandons d’utiliser une extension à la place.
WP PDF Embedder est l’une des meilleures extensions PDF pour WordPress. Il ajuste automatiquement la taille de vos fichiers PDF, ou vous pouvez spécifier une largeur et l’extension calculera automatiquement la hauteur pour vous.
Il est également livré avec une visionneuse de PDF qui comprend des boutons Suivant / Précédent et des boutons de zoom pour faciliter la navigation et la vue. Cette fonction est idéale pour afficher des documents plus longs, tels que des documents de référence pour des cours en ligne.
Tout d’abord, vous devrez installer et activer l’extension WP PDF Embedder. Si vous avez besoin d’aide, veuillez consulter notre guide sur l ‘installation d’une extension WordPress.
Note : Il existe une version gratuite de l’extension qui vous permet d’embarquer facilement des PDF adaptés aux mobiles dans WordPress. Cependant, nous utiliserons la version premium pour ce tutoriel car elle est livrée avec des fonctionnalités plus avant.
Une fois activé, allez dans Réglages » PDF Embedder pour définir les paramètres de l’extension.
Dans l’onglet « Réglages principaux », vous pouvez définir la largeur et la hauteur de vos PDF. La plupart du temps, vous pouvez surcharger ces réglages par défaut lors de l’Embarqué de chaque PDF. Par exemple, vous pouvez modifier la taille ou l’échelle d’un PDF individuel.
Toutefois, nous vous recommandons de modifier les réglages par défaut afin qu’ils correspondent mieux à vos Prérequis, car cela peut vous faire gagner beaucoup de temps et d’efforts.
D’emblée, PDF Embedder affiche la barre d’outils en haut lorsque les internautes survolent le document avec leur souris.
Toutefois, si vous avez l’intention d’inclure des documents plus longs ou des PDF de plusieurs pages, il peut être utile d’afficher la barre d’outils par défaut. Pour ce faire, il vous suffit de sélectionner l’option « Barre d’outils toujours visible ».
Vous pouvez également définir l’emplacement de votre barre d’outils en haut, en bas, aux deux Emplacements, ou la désactiver complètement en cliquant sur le menu déroulant.
Lorsque vous défilez vers le bas de la page, vous pouvez définir d’autres réglages pour votre visionneuse PDF. Par exemple, vous pouvez afficher des barres de défilement, activer le défilement continu de la page, ajouter un bouton de recherche PDF dans la barre d’outils, etc.
En outre, vous permettez aux internautes de télécharger les documents en affichant un bouton de téléchargement de PDF dans la barre d’outils. Vous pouvez également activer le suivi des vues et des téléchargements afin de mesurer la popularité de vos PDF auprès des internautes.
Lorsque vous êtes satisfait de la façon dont l’extension est configurée, cliquez sur « Enregistrer les modifications ».
Vous êtes maintenant prêt à ajouter une visionneuse de PDF dans WordPress. Il vous suffit d’ouvrir la page ou la publication où vous souhaitez afficher le PDF, puis de cliquer sur le bouton » + « .
Vous pouvez maintenant commencer à taper « PDF Embedder » et sélectionner le bloc adéquat lorsqu’il apparaît.
Ensuite, cliquez sur le lien pour ouvrir la médiathèque de WordPress et sélectionnez un PDF. Choisissez ensuite un PDF dans la bibliothèque ou téléversez un fichier depuis votre ordinateur.
L’extension affichera le PDF en utilisant vos Réglages par défaut, mais vous pouvez affiner l’aspect et le fonctionnement de ce PDF en utilisant les réglages dans le menu de droite.
Ici, vous pouvez modifier la hauteur et la largeur du PDF, l’Emplacement de la barre d’outils, le survol de la barre d’outils, les liens externes et le bouton de recherche.
Lorsque vous êtes satisfait de la façon dont le PDF est configuré, cliquez simplement sur « Mettre à jour » ou « Publier ». Vous pouvez maintenant visiter votre blog ou site WordPress pour voir la visionneuse de PDF embarquée.
Les internautes peuvent facilement voir vos documents PDF et utiliser la barre d’outils pour saisir le mode plein écran, zoomer, naviguer dans les pages, télécharger le PDF, etc.
Bonus : Comment gagner de l’argent avec vos PDFs Embarqués
Si vous avez des PDF de qualité et utiles, alors vous pouvez les utiliser pour gagner de l’argent en ligne avec WordPress.
Après avoir embarqué un document PDF sur votre site, vous pouvez transformer cette page ou cette publication en un contenu exclusif réservé aux membres. Les internautes peuvent alors trier une adhésion afin d’accéder à cette page ou publication et de voir le PDF Embarqué.
La façon la plus simple de transformer WordPress en site d’adhésion est d’utiliser MemberPress. C’est la meilleure extension d’adhésion WordPress qui vous autorise à transformer n’importe quelle page ou publication en un contenu exclusif réservé aux abonnés, y compris des PDF embarqués.
Nous avons un guide complet sur la création d’un site d’adhésion WordPress avec des instructions étape par étape pour vous aider à démarrer.
Nous vous conseillons également d’utiliser Easy Digital Downloads pour gérer et vendre des documents PDF sur votre site. Vous pouvez vendre facilement toutes sortes de biens numériques et embarquer les PDF dans les pages de produits en guise de prévisualisation, également.
Nous espérons que cet article vous a aidé à ajouter une visionneuse de PDF dans WordPress. Vous pouvez également jeter un coup d’œil à notre guide sur la création d’une newsletter par e-mail ou consulter notre liste des meilleurs services de marketing e-mail pour les petites entreprises.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Syed Balkhi says
Hey WPBeginner readers,
Did you know you can win exciting prizes by commenting on WPBeginner?
Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
You can get more details about the contest from here.
Start sharing your thoughts below to stand a chance to win!
Mrteesurez says
Good, helpful post.
But is it possible to embed a PDF and earn income while people read it online, something like Amazon KDP. Can this plugin be used to achieve this ?? or any custom way, let me know, thanks.
WPBeginner Support says
We do not have a method we would recommend at the moment for that.
Administrateur
Christian says
Works great on the latest version!
WPBeginner Support says
Thanks for letting us know
Administrateur
Ian says
I see that PDF Viewer has not been updated in 3 years, and has not been tested with my current version of WordPress (v4.9.1). Is this still the suggested plugin to use? It’s looking like no one is maintaining it, perhaps?
WPBeginner Support says
Hi Ian,
You are right. You should check out these PDF plugins for WordPress.
Administrateur
Manoj jidugu says
if am clicking print for my word press web page i am getting the page which is not properly aligned.
I am getting all the urls and content combined
Marek says
On the plugin page it says:
« This plugin hasn’t been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress. »
Maybe that’s why it does not work for some.
Kallol Das says
In my site pdfviewer does not work. In fact I cannot embed any pdf file on my blog post.
rajesh says
hi i want to publish a book in my wordpress site and people only read the book so can u refer me any easy pdf reader plugin
Omar says
This is not working for me on the last version of WP. Someone know a workaround? Or another option that works?
fred says
Hi guys,
the problem with PDF plugins like this ones, is that you cannot remove sibar(s) when generating your PDF, an that changes style a lot !
If ever I find one that has this so useful feature, I come back here to tell you ! Or maybe someone found one somewhere ?
ibrar says
NIce information
Nate Richie says
You should try ‘Embed Any Document’. It’s a much better alternative.
AllyG says
Thanks for the recommendation. It works great!!
Piet Marisael says
Is it possible to set the viewer by opening a file to 110% view automaticly and how i gonna do that?
It’s a perfect plugin used by WordPress 4.4.2 and twenty-eleven theme
Darron says
Hi Syed,
Many thanks for the ‘heads up’ on this issue.
I’ve been using the following free version of this plugin for the last two years, though have just upgraded to the premium due to the high number of fPDF’s held on my clients site:
So far I’ve had no issues at all with the premium version, I’m also able to ‘unbrand’ the document, plus track the number of download/views.
Rita says
I read the info that you indicated. Looks like the pdf viewer is not available for wordpress.com. Too bad. I understand the issue that readers who click on my url for a pdf will go to a separate page, and may not return to my blog. That is a problem. I didn’t know that I would have this a need to display pdfs when I started with wordpress.com, or I may have made a different choice.
Rita says
Am I correct that WordPress.org is the required application for the embedding plugin? If so, I suggest that information be clearly stated as a requirement. All references that I saw are to the generic WordPress, so it’s not possible (Did I miss it?) to determine whether there is a specific application requirement. It would help us newbies to avoid mistakes, and direct us to potentially making different decisions.
Thanks.
Dan says
I really appreciate your posts that identify a DIY (do it yourself) issue in wordpress, and then provide some alternate solutions, usually involving plug ins.
« But », am wondering if you take the time to read some of the reviews posted by users on the plugin page in wordpress.org directory, and also the LAST UPDATED info.
For example, this PDF VIEWER plugin was last updated « 8 months » ago, and is compatible up to WP 4.2.6
Also, per one reviewer….
« November 4, 2015 for WP 4.3.1
This plugin was precisely what I needed. Thanks!
******Only concerns are:
(1) This plugin leverages Mozilla PDF.JS framework. As of 2015-NOV, this plugin is significantly behind the present version of that framework:
Plugin Settings page states:
PDF.js Version Date
Stable 1.1.1 18 Mar 2015
Beta 1.1.114 7 May 2015
PDF.JS page states as of 2015-NOV:
Stable 1.1.366
Beta 1.1.469
SUMMARY > Don’t you think it’s good practice to use plugins with good ratings, but that are also consistently updated and highly rated ? If you do, please include some info in your posts that acknowledge a suggested plugin hasn’t been updated in a while, but appears to be the best solution among the ones currently available.
WPBeginner Support says
PDF Viewer allows you to use the beta version of PDF.js from the settings page. You may also want to see our guide on Should You Install Plugins Not Tested With Your WordPress Version?
Administrateur
Rita says
I use WordPress.com, not .org. Can I embed pdfs and other documents using a plug-in? I have found varying references, and want to be certain, before experimenting and possibly damaging m existing blog.
WordPress.com edit page does have a location labeled plugins. That also leads me to believe that I can use them, yet, references say « no ». I’ll appreciate an explanation.
Thanks
WPBeginner Support says
Please see our guide on the difference between self hosted WordPress.org vs free WordPress.com blog.
Administrateur
Md Riyaz Alam says
Hey Syed,
I think this is the first of its kind pots on wordpress. I did not see a post on PDF for WordPpress, but many of SEO and bloggers are looking for this pluging. So thanks to introduce this to the WP industry. This could be very helpful for tutorials as well.
Rita says
I am using WordPress.com (not .org). I want viewers to see my pdf documents on the same page as the rest of my blog post. Can I install the pdf viewer that is described here, in my WordPress.com blog?
Prince says
Thanks for this article. For SEO purpose, is it better to add the pdf content in text and add a button to download the link, or to display the pdf only using this viewer plugin ?
WPBeginner Support says
Like we said, a download link forces users to view the PDF separately. This decreases the time they spend on your page and their chances of coming back to resume browsing your website. You will get the same SEO benefit as adding a download link. Since it is written in JavaScript and compatible with HTML5 search engines can still index your PDF contents if the PDF file has text in it and not just images.
Administrateur