How to Display PDFs on a Drupal Site
An OSTraining member asked us about attaching PDFs to a Drupal site.
It is possible to use the default File field and allow people to download the PDF. However, this member wanted visitors to read the PDF directly on the site.
Step #1. Install the PDF Reader module
For this tutorial, you will need the PDF Reader module.
Step #2. Add the field
Now that we have installed the module, we are going to add it to the Basic Page content type. You can add this to any content type following the same steps:
- Go to Structure > Content types
- Select “edit” next to Basic page
- Select the manage fields tab
- Give the new field a name. For simplicity, I am simply calling mine “PDF”.
- In Field Type column, select File.
- Widget should then display File. Don’t worry about this, we’ll define the PDF in a moment.
- Save the changes.
Step #3. Configure the field
Now we need to configure the settings for our new field.
- I’m going to check both options, so that you have the file displayed by default.
- Save the settings.
Now we have to configure the manage field settings. We have to make one important change to this page. By default, the only file types allowed are txt files. We need to add PDF as an option.
- Allowed file extensions
- Go to manage display and update the PDF format from generic file to PDF Reader
- You will now see a cog with more advanced options if you want to tweak the display of the PDF. But for this I am just going to use the default display.
- Save the changes to the managed display.
Step #4. Select the PDF
Now we have a basic page content type. It has an additional field option to add a PDF and display it with a PDF reader.
- Create your content. Or edit it if you have added this to an existing content type.
- Under body, you will see a PDF section just like below.
- Select your file, press upload, and wait for the upload to finish.
- Once uploaded scroll to the bottom and select Save.
Check the end result
You should now see your content with the PDF displayed. By default, the scroll option is to scroll down to continue reading. But, you can adjust that by returning to display settings and changing the cog options.
Below you see my working demo displaying Acquia Drupal 8 guide.
Nice and simple module. Thanks for sharing !
Your Welcome Simon
@bazingawebdesign Great to hear, thanks
how we achieve the same on drupal 8.
You can use this module for Drupal 8 [url=https://www.drupal.org/project/gdoc_field]https://www.drupal.org/proj…[/url]
[quote=Daniel Pickering] Hola Ashish,
puedes usar este módulo para Drupal 8 [url=https://www.drupal.org/project/gdoc_field]https: //www.drupal.org/proj …[/url]
no se puede usar ese link no me funciona para D8 ayuda[/quote]
did not put the pdf on the page as a image it just put a pdf smal file icon that you could open also i could not change from generic file to PDF Reader any ideas for me?
it say no previews available
I have followed the steps, but at step 3 it will not let me update the Manage Display format. When I select PDF reader, it doesn’t give a cog to configure additional setting, instead I get the “throbber” gear. If I try to save settings, it reverts to Generic File. Any ideas as to what is causing this?
Thanks for sharing Daniel. Saved my day!
Daniel, but how do I choose file from an external url?
It would be nice to have a Drupal 8 implementation since Drupal 7 is approaching EOL.
Hi Daniel – Quick question for you….
If I import a PDF, can I import it in a manner that will allow me to text edit it – or import as a PDF and then covert it to an easily editable format? Any help or guidance is appreciated.
with Drupal 8 and 9 you would be best served using the Media module.
Add a media field to a content type, select Document.
In Manage Display, change it to “Rendered Entity”. Then click on the gear and change the View Mode to Full Content.
When someone clicks on the link in a node, it will open the PDF instead of downloading it.
The module listed above is VERY out of date and I don’t recommend using it in production.
I hope that helps.