Comment intégrer des fichiers PDF dans WordPress


Il peut arriver que vous souhaitiez incorporer un fichier PDF dans votre article ou votre page:

  • Un auteur de livre voudra peut-être en donner aux lecteurs un exemplaire gratuit.
  • Pour ajouter des catalogues de produits sur votre site Web.
  • Pour partager vos créations au format PDF avec les clients.
  • Vous gérez peut-être une agence de voyage et souhaitez afficher l’itinéraire des voyages organisés.

Mais il y a un problème!

Bien que WordPress vous permette d’intégrer des audios, des vidéos et bien sûr des images, il n’est pas possible d’intégrer des fichiers PDF dans vos articles et pages. Cette fonctionnalité n’est pas disponible pour l’instant, peut-être qu’elle sera ajoutée à l’avenir.

Si vous souhaitez ajouter un fichier PDF, vous pouvez télécharger le fichier à l’aide du Ajouter des médias option, insérez-le, et le lien vers ce fichier sera ajouté à votre page. Et vos visiteurs peuvent soit le télécharger, soit afficher le fichier dans le navigateur Web en quittant votre site Web.

Mais que se passe-t-il si vous souhaitez intégrer des fichiers PDF dans vos publications et permettre à vos visiteurs de les consulter sans quitter votre site Web? Y a-t-il une solution pour ça? La reponse courte est oui.

Donc, dans cet article, je vais montrer comment vous pouvez intégrer un fichier PDF dans votre article ou page WordPress. Avant de commencer, vous souhaitez probablement créer un document PDF bien formaté et soigné à l’aide d’un Éditeur PDF. Ensuite, vous serez prêt à l’ajouter dans vos articles avec ou sans utiliser un plugin. Commençons.

Comment intégrer un fichier PDF avec un plugin

Il existe de nombreux plugins que vous pouvez utiliser pour ajouter un fichier PDF à votre publication WordPress.

Cependant, nous utiliserons un plugin appelé Intégrateur PDF. C’est un plugin gratuit qui est disponible dans le répertoire WordPress Plugin. La meilleure chose à propos de ce plugin est qu’il utilise javascript pour faire son travail et non un service tiers ou des iframes.

Étape 1: Installez le plugin PDF Embedder

Connectez-vous à votre tableau de bord WordPress et accédez à Plugins> Ajouter nouveau. Rechercher maintenant Intégrateur PDF dans la zone de recherche. Une fois que vous avez trouvé le plugin, installez-le et activez-le. C’est simple, n’est-ce pas?

Installer le plugin PDF Embedder

Étape 2: Configurer le plugin

Bien que vous puissiez commencer à incorporer vos fichiers PDF une fois que vous avez installé ce plugin, vous pouvez d’abord modifier les paramètres pour améliorer l’apparence des fichiers intégrés. Pour ouvrir la page des paramètres de ce plugin, accédez à Paramètres> Intégrateur PDF dans la barre latérale gauche de votre tableau de bord WordPress.

Paramètres de PDF Embedder

La version gratuite de ce plugin vous permet de modifier les éléments suivants:

  • Largeur et hauteur – Vous pouvez modifier la largeur et la hauteur de la visionneuse PDF. Il accepte des valeurs entières (en pixels) ou max (100% largeur).
  • Emplacement de la barre d’outils – La barre d’outils de cette visionneuse PDF permet à votre public de faire un zoom avant ou arrière et d’aller à la page suivante ou précédente. Vous pouvez avoir la barre d’outils en haut, en bas ou les deux.
  • Survol de la barre d’outils – Vous pouvez choisir si vous souhaitez que la barre d’outils soit visible uniquement lorsque la souris survole le document ou non.

Maintenant, ce sont les paramètres universels. Mais que faire si vous souhaitez modifier les paramètres d’un fichier spécifique? Eh bien, vous pouvez le faire à l’aide de codes courts. Voici un exemple:

[pdf-embedder url=”http://yoursite.com/wp-content/uploads/2019/01/April.pdf”  width=”500″ toolbar=”top” toolbarfixed=”on”]

Dans l’exemple ci-dessus, la largeur est définie sur 500 pixels, l’emplacement de la barre d’outils est défini sur le haut et la barre d’outils est fixe. Vous pouvez également définir la barre d’outils en bas et la barre d’outils désactivée.

Ce plugin a également une version premium qui offre des fonctionnalités telles que le bouton de téléchargement, les vues de piste et le téléchargement, le défilement continu des pages et les liens ouverts dans une nouvelle fenêtre.

Étape 3: Incorporez un fichier PDF dans votre article ou votre page

Une fois que vous avez terminé avec les paramètres, vous pouvez commencer à faire le sale boulot. Maintenant, que vous utilisiez l’éditeur classique ou l’éditeur Gutenberg, vous pouvez facilement utiliser ce plugin pour obtenir le résultat souhaité.

Si vous utilisez le Éditeur classique, l’intégration d’un fichier PDF est similaire à ce que vous feriez pour une image ou une vidéo.

Tout d’abord, créez un nouveau post ou ouvrez-en un existant puis cliquez sur Ajouter des médias bouton. Maintenant, téléchargez votre fichier PDF, cliquez sur Insérer dans le message et un shortcode sera ajouté à votre message.

Incorporer un fichier PDF Éditeur classique

C’est tout – vous pouvez maintenant prévisualiser votre message pour vérifier s’il fonctionne correctement ou non.

Qu’en est-il de Éditeur Gutenberg? Eh bien, le plugin PDF Embedder est livré avec un bloc spécifique. Créez donc un nouveau message et cliquez sur l’icône Ajouter un bloc. Ensuite, recherchez Intégrateur PDF bloquer et sélectionnez-le.

Incorporer le fichier PDF Gutenberg Editor

Enfin, cliquez sur le bloc pour sélectionner (ou télécharger) votre fichier PDF et votre travail est terminé.

Voici le résultat final, quel que soit l’éditeur que vous utilisez:

Fichier PDF intégré final

Plugins de visualisation PDF populaires

Bien que le plugin PDF Embedder fasse du bon travail, il est toujours bon d’avoir des alternatives. Alors laissez-moi maintenant partager quelques plugins de visionneuse PDF gratuits et premium, sans ordre particulier:

Visionneuse PDF pour WordPress

Visionneuse PDF pour le plugin WordPress

Avec plus de 3900 ventes, le visualiseur PDF pour WordPress est le plugin de visualisation PDF qui se vend sur CodeCanyon. Il s’agit d’un plugin entièrement réactif et compatible avec tous les navigateurs. Ce plugin vous permet d’activer ou de désactiver des options telles que l’impression, le téléchargement, le zoom, la navigation dans les pages et le partage social. Vous pouvez également utiliser Google Analytics avec WordPress pour suivre le nombre de visiteurs lisant vos PDF.

Intégrateur Google Drive

Plug-in d'intégration de Google Drive

Google Drive Embedder est un plugin gratuit qui vous permet d’accéder à votre Google Drive à partir de votre tableau de bord WordPress et d’intégrer des PDF, des documents Word ou des feuilles de calcul à votre publication ou page. Cependant, pour utiliser ce plugin, vous devez installer Connexion à Google Apps ainsi – le but de ce plugin est de connecter votre Google Drive à votre site WordPress.

Visionneuse PDF Algori

Plugin de visionneuse de PDF Algori

Vous recherchez un plugin de bloc Gutenberg pour incorporer des fichiers PDF? Vous pouvez essayer le plugin Algori PDF Viewer. Ce plugin gratuit est compatible avec tous les navigateurs Web comme Google Chrome, Firefox, Safari, Opera et Internet Explorer 11. Il vous permet de charger plusieurs fichiers sur une seule page et prend en charge le mode présentation.

Plugin WordPress pour Real3D FlipBook

Plugin WordPress pour Real3D FlipBook

Comme son nom l’indique, Real3D FlipBook est un plugin de flipbook 3D réactif et tactile pour afficher des PDF et des images. Il a été développé en HTML5 et ne nécessite pas l’utilisation de Flash. Vous pouvez personnaliser les paramètres tels que la vitesse de retournement, le son de retournement, le niveau de zoom et l’angle de la caméra. Ce plugin prend également en charge le mode lightbox et plein écran.

Incorporer n’importe quel document Plus

Incorporer n'importe quel document Plus

Embed Any Document Plus est un plugin unique en son genre qui vous permet de télécharger et d’intégrer facilement des fichiers de document (PDF, Word, PPT, Excel, etc.) sur les sites Web WordPress. Le plugin ajoute un bouton «Ajouter un document» au-dessus de l’éditeur visuel. Cela ouvrira la fenêtre contextuelle EAD Plus à partir de laquelle vous pourrez sélectionner la source de votre document. Il est également étroitement intégré aux services cloud de Google Drive, Dropbox et Box.com. Vous pouvez rester sur votre site WordPress et télécharger des fichiers sur les services cloud et les intégrer directement à partir de là.

Après avoir téléchargé ou sélectionné le document que vous souhaitez intégrer, vous aurez également la possibilité de sélectionner le service de document que vous souhaitez choisir pour incorporer votre fichier. Le plugin reconnaîtra automatiquement le format de fichier et vous proposera le visualiseur. Les téléspectateurs peuvent gérer un fichier d’une taille maximale de 5 à 8 Mo. Pour les fichiers plus volumineux, les développeurs recommandent de les télécharger sur Google Drive et de les intégrer à partir de là.

Comment intégrer un fichier PDF sans plug-in

Eh bien, si vous faites partie de ceux qui sont toujours à la recherche de solutions sans plugin, alors cette section est pour vous. Nous pouvons certainement intégrer un fichier PDF dans des articles et des pages WordPress sans installer encore un autre plugin.

L’idée est simple: vous devrez télécharger votre fichier PDF sur votre compte Google Drive, puis utiliser le code iframe pour intégrer ce fichier dans votre site. Bien que cette méthode soit sécurisée, le seul problème est qu’elle utilise des iframes.

Étape 1: Aller à Google Drive et connectez-vous à votre compte (il vous suffit de créer un compte Gmail gratuit pour obtenir gratuitement 15 Go d’espace Drive).

Étape 2: Téléchargez le fichier PDF que vous souhaitez intégrer dans votre publication WordPress ici. Pour ce faire, cliquez sur Nouveau dans la barre latérale gauche de votre compte Google Drive, sélectionnez Téléchargement de fichierset téléchargez le fichier depuis votre ordinateur local.

Téléchargement de fichiers Google Drive

Étape 3: Une fois le fichier téléchargé sur votre lecteur, double-cliquez dessus pour prévisualiser le fichier. Maintenant, cliquez sur les 3 points verticaux (Plus d’actions) présents dans le coin supérieur droit et sélectionnez Ouvrir dans une nouvelle fenêtre.

Google Drive: ouvrir le PDF dans une nouvelle fenêtre

Étape 4: Dans la nouvelle fenêtre, cliquez sur Plus d’actions (les 3 points verticaux dans le coin supérieur droit) et sélectionnez Partager.

Google Drive: partagez

Étape 5: Une fenêtre contextuelle intitulée «Partager avec des personnes et des groupes» et «Obtenir un lien» s’ouvrira. Ici, cliquez sur Changer pour n’importe qui avec le lien dans la section «Obtenir le lien». Cela garantit que toute personne disposant du lien du fichier PDF peut le visualiser. Si vous ne le faites pas, le fichier restera privé et ne sera pas visible par l’audience de votre site Web.

Google Drive: partager les paramètres

Vous devriez voir la confirmation suivante:

Google Drive: partagez n'importe qui

Une fois que vous avez cliqué sur Terminé.

Étape 6: Il est maintenant temps d’obtenir le code d’intégration que nous utiliserons dans notre article. Pour l’obtenir, cliquez à nouveau sur Plus d’actions, sélectionnez Incorporer l’élément.

Google Drive: option d'intégration

Étape 7: Cela ouvrira une fenêtre contextuelle dans laquelle vous pourrez copier le code iframe.

Google Drive: code intégré

Étape 8: Rendez-vous sur votre tableau de bord WordPress et créez ou modifiez la publication ou la page dans laquelle vous souhaitez intégrer le fichier PDF. Maintenant, si vous utilisez le Éditeur classique, allez simplement dans l’onglet Texte et collez le code:

Onglet Texte de l'éditeur classique

Pour Éditeur Gutenberg, vous devez ajouter un nouveau bloc, rechercher du HTML personnalisé et enfin, ajouter le code iframe dans le bloc HTML personnalisé:

Bloc HTML personnalisé

Étape 9: Voilà – prévisualisez maintenant votre article ou votre page pour vérifier votre fichier PDF intégré.

Note de fin sur la façon d’incorporer des fichiers PDF dans WordPress

WordPress vous permet de créer un lien vers vos fichiers PDF – mais pas de les intégrer. Cependant, ce didacticiel résout ce problème. Il montre comment vous pouvez intégrer vos fichiers PDF dans vos articles ou pages, tout comme vos images et vidéos, avec ou sans l’aide d’un plugin.

Avez-vous déjà intégré un fichier PDF sur votre site Web en utilisant l’une des deux méthodes? Avez-vous un plugin alternatif en tête et pensez qu’il est meilleur que ceux mentionnés dans cet article? Faites-moi savoir vos pensées dans la section des commentaires.

Partagez cet article

Newsletter

Inscrivez-vous à notre newsletter pour profiter de toutes nos astuces !

Laissez une réponse

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *