If you want to embed a PDF document on your Virtual Hive universe you can use an iFrame. The browser will automatically render a PDF viewer.
Functionality
- Google Chrome, Firefox and Safari accept some parameters to customise the viewer. Add the parameters as part of the url fragment (after the
#). Multiple parameters can be separated by&.
<iframe src="/path/to/document.pdf#toolbar=0"></iframe>
To modify how a PDF viewer displays a document on the platform using an <iframe>, you can append different parameters to the URL of the PDF file. These parameters allow you to control aspects like the visibility of the toolbar, the initial zoom level, the starting page, and more.
The following parameters are supported:
| Parameter | Value | Description | Support |
|---|---|---|---|
toolbar |
1, 0 |
Show or hide the toolbar | Chrome |
view |
FitV, FitH, Fit |
Change the zoom level to fit (vertical, horizontal or both) | Chrome |
zoom |
number |
Set a specific zoom level in % (example: 300) | Chrome, FF |
page |
number |
Set initial position to a specific page (example: 2) | Chrome, FF, Safari |
nameddest |
string |
Set initial position to a named destination (like a heading) | Chrome |
Here are some practical examples of how you can customise the PDF viewer using these parameters:
Hide the Toolbar
To hide the toolbar in browsers like Google Chrome, you can set the toolbar parameter to 0. This is useful when you want to provide a cleaner look and focus solely on the document content.
<iframe src="/path/to/document.pdf#toolbar=0" width="600" height="500"></iframe>
Set Zoom Level
You can specify a zoom level as a percentage to make the PDF appear larger or smaller by default. For instance, setting the zoom to 300% makes the document appear three times larger than normal.
<iframe src="/path/to/document.pdf#zoom=300" width="600" height="500"></iframe>Open PDF at a Specific Page
If you want the PDF to open at a specific page, use the page parameter. This is especially useful for documents where you might want to direct users to a particular section that starts on a different page.
<iframe src="/path/to/document.pdf#page=2" width="600" height="500"></iframe>
Adjust Initial View Mode
The view parameter can control how the PDF fits into the iframe viewer. You can set it to FitV (fit vertically), FitH (fit horizontally), or Fit (fit both ways).
<iframe src="/path/to/document.pdf#view=FitH" width="600" height="500"></iframe>
Navigate to a Named Destination
If the PDF has named destinations (like bookmarks or headings defined in the document), you can direct the viewer to start at that named destination using the nameddest parameter.
<iframe src="/path/to/document.pdf#nameddest=chapter3" width="600" height="500"></iframe>
Example with Multiple Parameters
You can also combine multiple parameters using & to further customise the viewer. For example, opening the PDF at a specific page without a toolbar and at a specific zoom level:
<iframe src="/path/to/document.pdf#toolbar=0&page=4&zoom=150" width="600" height="500"></iframe>
Each of these examples provides different ways to enhance the user experience by controlling how the PDF is displayed when embedded on the platform across the different placeholders. Adjust these parameters according to the specific needs of your content and audience.