Embed PDF file into post

You can see an example at Testing embedding of PDF file into post. This is a small PDF file. I will test embedding a large PDF file and/or a PDF file containing images later. Anyway, here is the method I used to embed the PDF file. This uses this very useful website Scribd.

For this task, it is best you have a browser that has tabbed browsing like FireFox with tabbed browsing. You can thus be signed into Scribd in one tab, and signed into your Blogger account in another tab, etc, all in the same window. FireFox is also fully supported by Blogger. My experience also has taught me also that having more than 1 browser is a big advantage.

First, of course, you must have the PDF file ready and stored in your computer. Go to Scribd. You can chose to upload the file immediately or register first before uploading. It is better to register first as then you can edit or delete the file, get statistics, put up your profile where you can put links back to your site or sites, thus increasing your site/sites link popularity and PageRank and possibly getting more traffic to your site/sites. Once you edit your file, your embedded file in your post will also automatically change.

You can view my Profile at Cikguas227's Profile at Scribd where you will see a few links back to my blogs.

To embed your PDF file, click "Browse" and locate your PDF file, Click "Upload" and then "Publish". (If you happen to be at other pages other than the homepage, click , click "Browse" and locate your file. Click "Upload" and when uploading is finished, type in some suitable tags, a description, then click "Publish". The next page will tell you your file has been converted and give a link "View here!" . Click on the link "View here!". The next page will display your converted file and on the left sidebar, will be a box with the script for embedding into your post: . (Update: To get the script to embed the document, you will have to click the button SHARE as in the screen shot below:

)

Click on the inside of the box and the whole script will be highlighted. If it is not, press ctrl+A keys simultaneously (or right-click on your mouse and select "select all"). Press ctrl+C (or right-click and chose "copy") to copy script into clipboard. The original script generated by Scribd is shown in the scroll box below"

<object width="450" height="500"><param name="allowScriptAccess" value="SameDomain" /><param name="movie" value="http://static.scribd.com/FlashPaperS3.swf?guid=7i0x2tpgzzwtw&document_id=270243" /><embed width="450" height="500" src="http://static.scribd.com/FlashPaperS3.swf?guid=7i0x2tpgzzwtw&document_id=270243" type="application/x-shockwave-flash"></embed> </object>

Change to the tab where you are logged into Blogger with the post editor window opened, paste the script into the post editor window. Now, you may have to tweak the script so that the embedded PDF file fits nicely into the post. For this, you will have to know the width of your main column. Refer to How to find the widths of the Header, main column (posts) and sidebar/sidebars (click BACK button to get back to this page). Below is the original script generated by Scribd. The most important variable you have to note is width="500" (highlighted in red). The width of the main column (posts) of Testing embedding of PDF file into post is only 400 pixels, so I have to change the width in the script to 400 or less. The height is less important, and you can set it to any number you wish so that the height of the embedded file is as what you want it to be.

However, if you want to keep the original aspect ratio of the embedded PDF file generated by Scribd, like what I did for Testing embedding of PDF file into post, you will have to use a photo editor. The process is explained at Resize images with Irfanview. What I did was create an empty image and typed in 450 for the width and 500 for the height, then click OK. An empty image was created. I wanted the width to be slightly less than the width of the main column (posts). I ticked the box next to "Preserve aspect ratio" and typed in 399 for the width. The height automatically changed to 433, so I edited the script to get width="399" and height="433". Note that this has to be done in two places in the script (highlighted with red ellipse). The new script is shown in the scroll box below:

<object width="399" height="433"><param name="allowScriptAccess" value="SameDomain" /><param name="movie" value="http://static.scribd.com/FlashPaperS3.swf?guid=7i0x2tpgzzwtw&document_id=270243" /><embed width="399" height="433" src="http://static.scribd.com/FlashPaperS3.swf?guid=7i0x2tpgzzwtw&document_id=270243" type="application/x-shockwave-flash"></embed> </object>

This method can be used for both small and very large PDF file. The PDF file embedded at Testing embedding of PDF file into post is only one page long and 28.0 KB in size. I have tested embedding a larger PDF file (9 pages long and 1.44 MB in size at Dinner at the Xin Hua Restaurant in Sungai Way New Village (Kampong Baru Seri Setia), Petaling Jaya, Malaysia and there is no problem whatsoever. Perhaps one day, I may test embedding an even bigger PDF file.

There is another method to embed PDF file which will be described in the next post.

Update 9 September 2007: Missed something. Dnis aRCol said he embedded a 774 page PDF file at 2007 Nursing Board Exam Result. I tried to download the PDF file to check its size, but the Dnis has disallowed downloading the file in PDF format.

Acknowledgement: I came to know about Scribd from Dnis aRCol in a comment he made at Add spreadsheet, documents, PDF files to your post (click BACK button to get back to this page).