Display PDF File Within SharePoint Page

Products:  SharePoint 2007-2010, HTML

The Challenge
A client requested assistance with displaying a clickable PDF File within a SharePoint page.  The file consisted of a process workflow that contained clickable images that provided an intuitive experience for their users.  The requirement was to display each PDF page within the same area of the page.

The end result is that the solution needed to fit nicely within SharePoint.

The Research
I searched across the web and found some partial solutions that utilized the HTML tags of iFrame and Embed.  As with many things in life, it usually comes down to understanding the territory and a few special techniques.  This one is no exception.

The Solution & Implementation
The end result did utilize the Embed statement and also required a little finesse within the SP2010 environment.

0.  I included an Embed statement in a .txt file and stored it in the Site Assets library.

The width and height define the window in which the PDF source file will display.

NOTE:  This statement needs to be managed in a separate file as SP2010 likes to try and manage the code and sometimes it just really does more harm than good.  This just happens to be one of those times!

  1. Create a page where the PDF file will display
  2. Edit the page and insert a Content Editor Web Part (CEWP)
  3. Edit the web part and configure the Content Link property to point to the .txt file in the Site Assets library
  4. Configure other properties of the web part as needed, save and then publish the page to view the final result

The final result is a solution that was easy to build and will be manageable for the business user well into the future.

This is also a great example that demonstrates the three (3) layers of web design.    The content, style and presentation each are managed separately.

  • (Content) Revise the original PDF File
  • (Style)       Revise the .txt file Width and Height parameters of the Embed statement to size the window as needed
  • (Presentation) Edit the page and configure the web part properties

Success
The business user response was “worked liked a prayer.”

Summary
The real success of any project is empowering the business users with the tools, understanding and experience required to manage their solutions into the future.

References
Embedding PDF’s in SharePoint
Embed PDF and Text Files in SharePoint

How has SharePoint affected you?

Advertisements
This entry was posted in SharePoint, Web Parts. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s