Examples of integrating PDF documents in the HR Classroom u-Build Training Editor.
A PDF document requires an app to render and view the document. A PDF document is not a web page and therefore must be integrated into a web page in some way, similar to a Word document, a spreadsheet, or a PowerPoint document. Below we will outline some options for placing a PDF in a training using the HR Classroom u-Build Training Editor.
We have created a test training for you to view the different options. Please click the link to navigate to the test training. Test Training.
PDF Integration Options
I. Convert the PDF document to an image:
The end result you are shooting for is an image with a resolution of 150 DPI and a width of 950 pixels.
A. PC Example:
Navigate to the website http://pdftojpg.me/
Upload your PDF. For a training I used a setting of DPI of 150. Instead of Fixed Image Width, you use Fixed DPI (Dots Per Inch) and you type in 150 in the box next to DPI.
Once you have downloaded the images you can open the image with Microsoft Paint to change the Image to 950 pixels wide. You should have an image per page which has a resolution of 150 DPI and it is 950 pixels wide.
B. Mac Example:
Open the PDF with Preview. Select File and Export the current page you have selected via Format as a JPEG. Once you have selected JPEG, select a resolution of 150 pixels/inch. Next, open up your JPEG with Preview, select Tools, and Adjust Size. Select Pixels on the pull down to the right, and type in 950. Your Resolution should be 150 Pixels/inch. If it is not, something has gone wrong. Next, click OK, and then save your image.
II. Frame the PDF in the training page using Google Doc's gview to render the document.
A. First you must have your PDF hosted somewhere, where you can refer to the PDF in your text, such as https://www.osha.gov/Publications/osha3165-8514.pdf
B. To place this file in a page you would select your page, select the HTML view which is next to the Design view, and paste the following text and then save:
Option using Google Doc's gview to view the OSHA PDF:
<iframe src="https://docs.google.com/gview?url=https://www.osha.gov/Publications/osha3165-8514.pdf&embedded=true" style="width:950px; height:1225px;" frameborder="0"></iframe>
The example HTML code is here:
<iframe src="https://docs.google.com/gview?url=http://example.com/mypdf.pdf&embedded=true" style="width:600px; height:800px;" frameborder="0"></iframe>
III. Host on Google Docs, which will use Google's PDF rendering by default.
A. To use this option you must have place the PDF document in Google Drive. View the PDF document in Google Drive by double clicking, select the 'pop out" button in the upper right, and then select the 'more actions' dots, and the 'embed' option. You should now have embed text from Google Docs similar to: <iframe src="https://drive.google.com/a/hrclassroom.com/file/d/0By2ncXEb2N8BNTJmZ1k5SzlSR1U/preview" width="950" height="1355"></iframe>
B. Simply Edit a page in u-Build. Select 'HTML', 'Design', and paste the HTML text below, and save the page. Please note that a width of 950 normally works in our training template however depending on the pdf, you may need to modify the height. The OSHA PDF is an 8.5"x14" page size.
<iframe src="https://drive.google.com/a/hrclassroom.com/file/d/0By2ncXEb2N8BNTJmZ1k5SzlSR1U/preview" width="950" height="1355"></iframe>
IV. Frame the PDF in the Training page using your Web Browser to render the PDF document.
A. First you must have your PDF hosted somewhere, where you can refer to the PDF in your text, such as https://www.osha.gov/Publications/osha3165-8514.pdf
B. To place the above file in a page you would select your page, select the HTML view which is next to the Design view, and paste the following text and then save:
<embed src="https://hrcompliance.hrcare.com/cmdocs/osha3165-8514.pdf" width="950" height="1355" type='application/pdf'>
or more generic example code.
<embed src="https://yoursite.com/the.pdf" width="600" height="800" type='application/pdf'>
V. Host the PDF Document on your website or another website.
A. Simply use the Link or URL tool to create a link to your website.
B. When building the link make sure to select "New Window" where you want the link to open. If you select "Same Window" the user will open the PDF in a window, and possibly have to relaunch the training.
VI. Host the PDF in HR Classroom and use the PDF upload and attachment tool in the HR Classroom u-Build training Editor.