Using Google Viewer to display PDF Files in your Web Site
I have been developing a site that contains several large PDF files. I wanted to have a quality version of the file for downloading and a lower quality for online viewing. The online version is a lower quality so that delay is minimised.
In doing this I discovered a few things.
- You can use Acrobat X to produce reduced size version that will start display the first page without waiting for the whole file to be made ready.
- All the browsers handle this file differently, and some not at all
I am using Weebly to build the site, and the Pro version has a feature to display PDF files using the viewer Scribd. THis is OK but appears to be Adobe Flash based, and it does not work on IOS (iPhone, iPad) platform. Therefore I looked for another approach. I noticed in testing the
Google Chrome browser is that it uses its own
Google Docs Viewer. This facility can be used in your own web sites.
This is the page being developed within Weebly Pro.
I want the
Alternative Viewer called by the
ONLINE QUICK button
to use the Google viewer.
First you need to upload the PDF to Weebly. To do this I use the standard Weebly features to create a button and link this button to my PDF.
The file I uploaded is named in the
File on Your Website. Copy this filename. Publish this site using standard Weebly methods and navigate to the page.
Clicking on the button will open PDF file as shown below (this may look different depending on browser).
The online filename is given in the browser navigation box. Copy this name.
You now need to open another tab in your browser and go to
docs.google.com/viewer where you paste the address of the PDF in the first box. Click on
Generate Link
You should now see the following screen. There are options to embed the code into a HTML page, but the option I use is
Paste this link into email or IM: Copy the link.
Return to Weebly development page edit the button so that it now links to the address we copied previously.
Again, using standard Weebly controls publish the site and visit the page. Now when you click on the
QUICK ONLINE button you should see the following
Google Viewer version of the PDF, which in my case opens in a new tab.
Real Example
If you want to see this in action then please visit
The Orange Tree Press
site. This company sells high quality greetings cards, mainly of a religious nature.
Thank you for an interesting article, I like weebly, although I do get annoyed with it's silly limitations, No not a grip regarding Standard and Pro accounts (I have been Pro for some time and benefited from their 2yr renewal earlier this year)
ReplyDeleteI refer to the silly limitations such as download a back up - but it is useless as you can't upload it ? There must be a reason for this, but I'm buggered if I can find it!
However, AS you gave a tip, I will pass 3 back...
1, Use the zip function to down load the back up and edit it using a easy free program such as KompoZer http://www.kompozer.net/ free to use and under a few kb (you can run it from a usb (or even dropbox) edit the page and upload it as a page back to weebly via their edit themes.
2, Consider Acrobat XI it will save big PDF's as PNG - Which can be uploaded into Weebly's Photo Gallery's ( I made a 230 Page Flip book this way - works a treat - http://delfs.weebly.com)
3. Best of all, make the ultimate upload/down load page using OpenDrive and add it as an iframe in Html - nice to be able to let others upload pictures, letters etc or down load your info at no expense! - http://docs.delf.pro/home.html
Open drive allows public folders to be accessed without any login and you can specify which folders are shared. so 1 account can run as many sites as you need without cross-overs.
Hope some of these tips help
David
PS Sorry, didn't quite explain (adding unable to edit post to the list of gripes)
ReplyDeleteUsing the PNG I was able to upload the whole book under 8MB! usually it would be 250+ MB which would kill the page, or leave the viewer time to cook dinner and paint the house!