Om du visar PDF-filer direkt på din WordPress-webbplats kan du förbättra användarupplevelsen genom att ge enkel åtkomst till dokument, e-böcker och annat värdefullt material.
En inbäddad PDF-läsare gör det möjligt för din publik att visa innehåll sömlöst och interagera med det direkt på din webbplats. Dessutom ser den till att alla dina filer har samma layout, oavsett vilken enhet besökaren använder.
I den här artikeln visar vi hur du enkelt kan lägga till en PDF-läsare i WordPress. Våra steg-för-steg-instruktioner kräver ingen kodning, så du kan använda dem även om du är nybörjare.
Varför behöver du en PDF-läsare i WordPress?
Många WordPress-webbplatser använder PDF-filer för delning av information om sina tjänster och produkter. Om du till exempel har en website för en restaurang kan du publicera din menu som en online-PDF.
Du kan alltid uploada en PDF till din website och sedan add to en download-länk i WordPress. Detta är dock inte den bästa användarupplevelsen för användare som snabbt vill klämma på ett PDF-dokument eller inte vill ladda ner hela filen.
Istället kan du lägga till en PDF-läsare i WordPress och sedan visa PDF-filer direkt på din website. Detta allow visitors to see the document without downloading it, vilket är viss nytta för användare av smartphones och surfplattor.
Det håller också kvar besökarna på din website, vilket kan öka antalet sidvisningar och minska avvisningsfrekvensen.
Med detta sagt, låt oss nu se hur du enkelt kan add to en PDF-läsare till WordPress. Använd bara snabblänkarna för att hoppa direkt till den metod du vill använda:
Metod 1: Add till en PDF-läsare med Block Editor (lätt)
Det enklaste sättet att visa PDF-filer på din WordPress website är att använda det built-in File-blocket i Gutenberg editor.
Den här metoden kräver inget särskilt plugin, men du kan bara customize visaren på några få sätt. Om du vill ha mer avancerade customizes och funktioner rekommenderar vi att du använder ett WordPress plugin istället.
För att komma igång öppnar du bara sidan eller posten där du vill lägga till PDF-tittaren och klickar sedan på knappen ”Add Block” (+) för att lägga till ett nytt block.
Därefter börjar du skriva in ”File” och väljer rätt block när det dyker upp.
Om du redan har uploadat din PDF till mediabiblioteket i WordPress klickar du på knappen ”Mediabibliotek”. Du kan sedan välja den PDF som du vill embedda.
Om du inte redan har uppladdat PDF:en klickar du på ”Upload” och väljer sedan en fil från din dator.
WordPress väljer automatiskt en storlek för den embedade PDF:en.
Beroende på filens storlek kan det hända att standard view inte visar hela dokumentet. Besökare kan dock zooma in och ut och rulla genom PDF:en med hjälp av toolbarens inställningar.
Om du vill kan du ändra PDF-läsarens höjd för att visa mer eller mindre av det inbäddade dokumentet.
För att göra detta använder du helt enkelt slidern ”Height in pixels” i den högra menyn.
Ibland vill besökarna kanske downloada en PDF, så att de alltid har den close by.
Customers kanske till exempel vill downloada användarmanualen för yours mest populära produkt eller schemat för en kommande händelse eller konferens.
Som standard visar WordPress en ”Download”-icon i toolbaren och en knapp under PDF-filen.
Knappen ”Download” kan vara till hjälp för besökare som inte känner till de olika icons som finns i PDF toolbar.
Med detta i åtanke kanske du vill låta knappen ”Download” vara aktiverad. Men om du inte vill inkludera detta duplicerade content kan du clicka för att inaktivera toggeln ”Show Download Button”.
När du är nöjd med hur PDF-filen är konfigurerad klickar du antingen på ”Update” eller ”Publicera” för att göra dina ändringar.
Om du nu besöker din WordPress website ser du PDF-viewern i action.
Metod 2: Add a PDF Viewer in WordPress Using a Plugin (Mer anpassningsbar)
Det built-in WordPress File block är ett bra alternativ om du bara vill embedda några PDF-filer. Men om du vill ha mer control över visaren rekommenderar vi att du använder ett gratis plugin istället.
WP PDF Embedder är ett av de bästa plugin-programmen för PDF-visning i WordPress. Det justerar automatiskt storleken på dina PDF-filer, eller så kan du ange en bredd, och pluginet beräknar automatiskt höjden åt dig.
Den levereras också med en PDF-läsare som innehåller knappar för nästa/förra och en zoomknapp för enkel navigation och view. Detta är perfekt för att visa längre dokument, t.ex. referensmaterial för onlinekurser.
Först måste du installera och aktivera pluginet WP PDF Embedder. Om du behöver hjälp, vänligen se vår Step-by-Step guide om hur du installerar ett plugin för WordPress.
Note: Det finns en gratis version av pluginet som låter dig enkelt embedda mobilvänliga PDF-filer i WordPress. Vi kommer dock att använda premium-versionen för denna tutorial eftersom den kommer med mer avancerade funktioner.
Efter aktivering, besök Settings ” PDF Embedder page från WordPress dashboard för att konfigurera plugin-inställningarna.
Från tabben ”Main Settings” kan du ställa in bredd och höjd för dina PDF-filer. För det mesta kan du åsidosätta dessa standardinställningar när du embedar varje PDF. Du kan till exempel ändra en enskild PDF:s storlek eller skala.
Vi rekommenderar dock fortfarande att du ändrar standardinställningarna så att de bättre matchar dina egna krav, eftersom det kan saved you mycket tid och ansträngning.
Som standard visar PDF Embedder toolbaren högst upp när besökaren hoverar musen över dokumentet.
Men om du har planer på att inkludera längre dokument eller PDF-filer med flera pages kan det vara bra att visa toolbaren som standard. För att göra detta väljer du helt enkelt alternativet ”Toolbar alltid synlig”.
You can also set your toolbar location to the top, bottom, or both locations or inaktivera den helt genom att click on the dropdown menu.
När du rullar ner på sidan kan du konfigurera fler Settings för din PDF-tittare. Du kan till exempel displayed scrollbars, aktivera kontinuerlig rullning av page, add to en knapp för PDF search i toolbaren med mera.
Dessutom kan du allow visitors to download documents genom att visa en PDF Download knapp i toolbaren. Du kan också aktivera tracking av views och downloads så att du kan mäta hur populära dina PDF-filer är bland besökarna.
När du är nöjd med hur pluginet är inställt klickar du på ”Save Changes”.
Nu är du redo att add to en PDF-visning i WordPress. Öppna bara den page eller det post där du vill visa PDF-filen och klicka sedan på knappen ”+”.
Du kan nu börja skriva in ”PDF Embedder” och välja rätt block när det dyker upp.
Klicka sedan på länken för att öppna mediabiblioteket i WordPress och välj en PDF. Välj sedan en PDF från biblioteket eller uploada en fil från din dator.
Pluginet kommer att visa PDF-filen med dina standardinställningar, men du kan finjustera hur denna PDF-fil ser ut och fungerar med hjälp av inställningarna i menyn till höger.
Här kan du ändra PDF: s höjd, bredd, verktygsfältets location, verktygsfältets hovering, externa länkar och knapp för search.
När du är nöjd med hur PDF:en är konfigurerad klickar du bara på ”Uppdatera” eller ”Publicera”. Du kan nu besöka din WordPress-blogg eller webbplats för att se den inbäddade PDF-visningen.
Visitors kan enkelt view your PDF documents och använda toolbar för att enter fullscreen mode, zooma in, navigera pages, download the PDF, med mera.
Bonus: Hur man tjänar pengar på dina embedade PDF-filer
Om du har användbara PDF-filer av hög kvalitet kan du använda dem för att tjäna pengar online med WordPress.
När du har embeddat ett PDF-dokument på din website kan du göra den page eller det post till exklusivt content för medlemmar. Besökare kan sedan köpa ett medlemskap för att få tillgång till den sidan eller posten och se den inbäddade PDF-filen.
Det enklaste sättet att förvandla WordPress till en membership site är att använda MemberPress. Det är det bästa WordPress plugin för medlemskap som allow you att förvandla vilken page eller post som helst till exklusivt content för prenumeranter, inklusive inbäddade PDF-filer.
Vi har en komplett guide till hur du skapar en WordPress-medlemskapswebbplats med Step-by-Step-instruktioner som hjälper dig att komma igång.
Vi föreslår också att du använder Easy Digital Downloads för att hantera och sälja PDF-dokument på din website. Du kan enkelt sälja alla typer av digitala varor och embed PDF-filer på produktsidorna som preview också.
Vi hoppas att den här artikeln hjälpte dig att lägga till en PDF-läsare i WordPress. Du kanske också vill ta en titt på vår nybörjarguide om hur du bäddar in PDF-filer, kalkylblad och annat i WordPress-blogginlägg, eller kolla in vår handledning om hur du bäddar in TikTok-videor i WordPress.
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.
Dennis Muthomi
Great guide!
one question though – is there any notable impact on page load times when embedding larger PDF files using the plugin method?
For sites with many embedded PDFs, especially if some of those PDFs have huge file sizes, it would be good to know if there are any performance considerations to keep in mind.
sometimes serving up large PDF files could potentially slow down page loading.
WPBeginner Comments
If the PDF has a large file size, then it may take a bit for the PDF to load on the page. However, in many cases this won’t be a problem.
Mrteesurez
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
We do not have a method we would recommend at the moment for that.
Administratör
Christian
Works great on the latest version!
WPBeginner Support
Thanks for letting us know
Administratör
Ian
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
Hi Ian,
You are right. You should check out these PDF plugins for WordPress.
Administratör
Manoj jidugu
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
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
In my site pdfviewer does not work. In fact I cannot embed any pdf file on my blog post.
rajesh
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
This is not working for me on the last version of WP. Someone know a workaround? Or another option that works?
fred
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
NIce information
Nate Richie
You should try ’Embed Any Document’. It’s a much better alternative.
AllyG
Thanks for the recommendation. It works great!!
Piet Marisael
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
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
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
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
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
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?
Administratör
Rita
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
Please see our guide on the difference between self hosted WordPress.org vs free WordPress.com blog.
Administratör
Md Riyaz Alam
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
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
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
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.
Administratör