Embed pdf Document to Your WordPress Blog Without Plugin
Have you ever wondered how to embed a PDF file to your WordPress blog post or pages? Or have you been to a site where the author displays an embedded PDF file and you’re like whaaaat! How did he do that?
Believe me, I was impress when I saw an embedded PDF post on a blogger’s blog some time ago. How did he do it? I did not know, but what I saw that day really did impress me…
How It came up to this…
Okay! Here is my story – When a company or any person meets me for a sponsored post, plugin reviews and others, I send them a downloadable pdf file of my pricing. It looks great and more professional when you send clients your downloadable price list, but to me, it looks troublesome…
Must Read: Best ad Networks for Publishers and Their Secrets
So I thought to myself, how can I show clients my pricing without them downloading it? And I just don’t want to make the list as a regular post or as my other pages.
So I start a one day research on how I can embed my pdf document on my blog without plugin but with a simple code 🙂
All tutorials I saw on the topic were old and outdated. Even one of the plugin I saw that’s supposed to do the magic, has been left by his creator for more than 2yrs.
After a long day search, I did saw a code that worked for me… and I am sure it will work for you as well if you do exactly as my tutorial say.
Recently, I embedded the pdf file to a page on my blog. Would you like to see it? Here is a pdf file of my blog ad and sponsored review pricing here…
Does it have browser compatibility issue?
Well, I have tested it on several browsers (IE 10, chrome, Firefox, Opera) and it worked just fine so you shouldn’t be worried about browser compatibility issues.
Now let me ask you this simple question: would you like to know how to embed pdf document to your wordpress blog without plugin as I did above? If your answer is yes, then we are going to discuss all that in this short tutorial.
Embed pdf Document to Your WordPress Blog Without Plugin
First – let’s start by uploading the pdf file to our media library by going to your WordPress blog dashboard and click on “Media” >>> click “Add New” >>> select your pdf document to upload.
Must Read: My Top 10 Firefox and Chrome Extensions Every Blogger Should Have
Have you uploaded it? If yes, check by the right hand side of the uploaded document and you will see “File URL” exactly like the image below.
Now simply copy your uploaded document url and paste it on a notepad.
We’ve done the first part completely without stress; now let’s move on to the next episode and see if it’ll be as easy as the first step. Shall we?
I hope you are still in your blog’s dashboard? If yes, click on “Pages” >>> create a new page by clicking on “Add New”.
Now that we are in the new page, you can add your title.>>> After adding your title, click on “Text” above your editor. See image below.
Now copy the below code and paste in the text area…
[code]<iframe style="width: 880px; height: 1200px;" src="http://docs.google.com/gview?url=http://YOUR-URL/wp-content/uploads/2014/07/Onenaijablog-rates.pdf&embedded=true" width="300" height="150" frameborder="0"></iframe>[/code]
Have you done that? You can replace the “http://YOUR-URL/wp-content/uploads/2014/07/Onenaijablog-rates.pdf” url with your document url you uploaded earlier.
Have you done that? Now, simply click the “Publish” button… and you’re done.
Go check the page and see how awesome it looks.
The tutorial looks so simple right? Yeah I know, 🙂 .
Note: Please before hitting the publish key, do not turn your editor to visual, just make sure it’s on text mode all through the process
Must Read: Enabling Windows 8 .Net Framework 3.5 the best Way
You can also use the code above to embed MICROSOFT, EXCEL, POWERPOINT, and PDF Document without stress and it will look good while doing it.
have you done this on your blog before? How was it? Did you notice any side effect? Do use the comment box below to share your experience with us 🙂
Do you have comments questions and thoughts you’d love to share with us? Then please do use the comment box below. Remember that your comments, questions and thoughts are highly welcomed and most appreciated.
Was the post helpful? Then please do click the like button, share us and recommend us to friends. You’ll never know which of your friends might be in need of a lovely post as this one.
Oww…. do not forget to subscribe to our feed for your latest and hot updates on the go…
So let me ask you this question. Why would you need to embed a PDF when all you had to do was make it a page on your blog but just not make it visible to anyone else. When people approach you then that’s when you would just send them the link to your page that had your prices on them. I guess I haven’t run across any blogs that had these embedded which is why I’m asking. I guess I’m confused as to why they would use them.
Either way whether I understand the reasoning behind it or not, I appreciate your instructions. I mean if I need t know how to do this I now know where to go so I can follow your directions easily. You know me, I do like easy!
Thanks Babanature for this and you have an awesome week.
Sharing just your pricing to your clients as a blog post doesn’t look professional. Some top bloggers i know use pdf to present their pricing… Remember, Branding ourselves is the keyword here…
People create presentations because they wants to look professional in the eyes of their investor. when they can easily give their investors just papers on what they want to present 🙂
I have seen an embedded pdf on more than 100s of sites and many of the sites use theirs for different reasons/purpose 🙂
Thanks for stopping by and lighten up the post, it was indeed appreciated. Do have a wonderful week ahead, because amma do too 🙂
It’s been a while and I’m glad that I stumbled upon this post. I have seen people embed a pdf on their sites but didn’t have the slightest idea of how they did it. I’m glad that you were able to talk about this and give us the “how to” on what to do to accomplish this! Now I know where to come to in case i want to do this! Thanks for sharing!
It’s good to know that you’ve seen some embedded pdf on some blog 🙂
Glad you liked the post dear friend…
Thanks for stopping by and dropping your comment. Do have a nice week ahead…
I will say that you are a saviour, I have searched for this particular post for long and I gave up on it.
Thanks once more.
Glad you’ve seen how to and a simple step by step guide.
Thanks for stopping by and do have a nice week
Baba, really informative article.
Have seen some site that do disable the copy button.
Is this the same way that it was done?
Thanks for sharing this informative tutorial
Embedding a pdf document is different from disabling a mouse click… 🙂
Babanature, nice breakdown! Embedding properly creates a pretty presentation. Thanks!
Yeah, you are right, Ryan 🙂
Thanks for stopping by and dropping a comment, do have a lovely week ahead…
Thanks for a great tutorial on how to embed a pdf file into a blog post.
Like Adrienne, in my short time in the blogospere, I did’t see a blog with a blog post that has an embedded pdf, but it is absolutely valuable to know about it now. I am sure I will need it one day and you made it very easy with your step-by-step tutorial.
Thanks Babanature for sharing your knowledge. Have a great week ahead.
I am sure that when the time comes, you’ll definitely need it as well 🙂
Thanks for the comment dear friend. do have a great week ahead…
nice post..I did’t see a blog with a blog post that has an embedded pdf, but it is absolutely valuable to know about it now.
It does not necessarily means it would be as a blog post. It could be a pricing, or at the finalizing of a form or an agreement. 🙂
Anyways glad you could make a comment. Do have a wonderful week ahead…
This is my first visit on your blog and really I’m impressed!!!! 🙂
Very informative article you have posted, i found your article very helpful and useful for me, i didn’t see or use any embedded PDF in blog post. seems this article very valuable for me.
Thanks for sharing.
The best advantage of embedding pdf without plugin is that you don’t have to add another plugin into your huge list of already added plugin. The benefit you get by doing this is you don’t receive any hit on your blog speed as “lesser the plugins, higher the speed” is an open secret.
After reading this post one does have all the rights to shout it is so easy or oho I knew it earlier or oh I can do this already but the secret your shared here is a great resource for all of us either one admit it or not.
A big thank you for sharing this wonderful tutorial which must have eased long drawn difficulty of many bloggers who want to publish a PDF file just like they do an image file.
Just visited the advertise with us page, looks professional, I like it.
And congratulations on your traffic, great numbers you’ve got there Babanature.
Nice to be here again after a bit gap.
Hope you are doing fine.
This post is really an informative one.
I will try this out. Thanks a lot for the share.
I am here via twitter.
There is a really cool plugin Embed Any Document( free ) which will allow you to embed any kind of document on your site with out any mess.
It didn’t work for me and I can’t use plugins because I don’t have wordpress.org. 🙁
Wao. First time am here and found very helpful data for Every newbie blogger. Thank You So Much
Glad you liked the post… You can always share the post with friends so they will appreciate it with you.
It is really helpful man, i was searching for this exact thing from last 2 days. finally i came to know your blog. thanks alot.
i want to ask one thing why there is a pop out box on uper right side of pdf file in webpage?
Thanks for tip.
Begin I use tag “embed” but it don’t show on IE.
Best upload file PDF to Google Drive and embed it use tag “iframe”
PS: now Google docs updated to Google Drive, very good