UPDATED 6/15/2011
The following is the introduction to a series of articles that provide examples and tutorials to help in the development of Custom PDF Portfolio Layouts for Acrobat X.
About PDF Portfolios and Navigators
Adobe Acrobat X Pro allows you to create PDF Portfolios, which are single PDF files that act as a container for other files (called attachments) and an embedded Flash application to navigate and manage those attachments. These attachments can be in different formats, of different types, and created by different applications. The original files retain their individual identities when they become part of the single PDF Portfolio. It’s similar to what happens when you create a ZIP file, just a lot cooler.
The presentation and management of the attachments in a PDF Portfolio, and any actions taken on them, such as viewing and editing, is managed by a PDF Portfolio Layout, or Navigator. In other words, a Navigator is an embedded Flash application that’s used to navigate content in a PDF Portfolio. It defines animations, colors, visual styles, fonts, headers, footers, background, generates previews, determines the treatment of specific document types and more. You create Navigators in Adobe Flash Builder 4 with the Acrobat Portfolio SDK.
Note: This guide uses the term Navigator rather than the marketing term PDF Portfolio Layout. The informal term is more meaningful for developers because it corresponds to the type of file that represents a PDF Portfolio Layout.
A Navigator can include a range of interactive features, including user interface components (widgets), animation, and localized strings. It can also contain media files-such as video clips, images, and mp3 files, to provide a rich media experience. The Navigator interacts with PDF Portfolios through the Acrobat API.
Acrobat Pro allows you to apply PDF Portfolio Navigators to a PDF Portfolio. When applying a Navigator, you can choose from the Navigators installed with Acrobat Pro, or you can apply a custom Navigator that you or others develop. When a Navigator is applied to a PDF Portfolio, it gets embedded and becomes part of that PDF Portfolio. Users of Acrobat X or Adobe Reader X can then view the PDF Portfolio that contains the embedded Navigator. Acrobat users have the ability to update the PDF Portfolio, and Acrobat Professional users can edit the Navigator properties and contents.
The Adobe Acrobat Portfolio SDK for Acrobat X greatly simplifies the process of creating custom Navigators over Acrobat 9. It’s wizards automate the process of creating an initial working Navigator, debugging your Navigator, and packaging the completed Navigator along with its resources as a Navigator (NAV) file.
Watch this video to learn how to create a PDF Portfolio in Acrobat X Pro.
Watch this video to hear Senior Experience Designer, Jacob Surber, share a behind the scenes look at the reinvention of PDF Portfolios in Acrobat X.
Getting Started:
System Requirements: To build Navigators using the Acrobat Portfolio SDK the following must be installed on your system. While the Acrobat Portfolio SDK is free, the authoing tools are not. The links below will allow you to download the free SDKs and trial versions of the required products.
- Adobe Acrobat Pro X or later [download free trial]
- Adobe Flash Builder 4.0.1 or higher [download free trial of FB 4.5]
- Adobe Flex 4.1 SDK [free download]
- Adobe Acrobat Portfolio SDK [free download]
Note: If you are using Flash Builder 4.5, you must download and install the Flex 4.1 SDK. The Portfolio SDK was developed prior to the Flex 4.5 SDK becoming available.
Getting Started
There are seven basic steps to build a PDF Portfolio Layout (Navigator) using the Acrobat Portfolio SDK:
- Download the Acrobat Portfolio SDK
- Install Acrobat Portfolio SDK and plugins in your Flash Builder programming environment.
- Run the Create Navigator Project wizard.
- Use ActionScript and the Acrobat Portfolio SDK to program your Navigator.
- Test and debug your Navigator using the Debug Adobe Navigator wizards and the AIR-based Previewer application.
- Export your Navigator as a Navigator (*.nav) file.
- Import your Navigator into a PDF Portfolio using Acrobat X Pro.
Installing the Portfolio SDK
Before you can begin developing your Navigator, install the Acrobat Portfolios SDK, install the acroFlashDebug.api plugin into Acrobat, and install the Navigator plug-ins for Flash Builder. The Acrobat Portfolio SDK was developed based on Flash Builder 4.01 and the Flex 4.1 SDK. All instructions in the Acrobat Portfolio SDK are based on Flash Builder 4.01. I am using Flash Builder 4.5 and other than a few very minor issues, everything works as expected but because the directory structure of Flash Builder 4.5 is slightly different from Flash Builder 4.01, installation is slightly different.
If you are using Flash Builder 4.01, follow the instructions here.
If you are using Flash Builder 4.5, follow the same directions but add the word "eclipse" before the final folder name for the Flash Builder add-ins.
C:\Program Files\Adobe\Adobe Flash Builder 4\plugins\
becomes…
C:\Program Files\Adobe\Adobe Flash Builder 4.5\eclipse\plugins\
C:\Program Files\Adobe\Adobe Flash Builder 4\
becomes…
C:\Program Files\Adobe\Adobe Flash Builder 4.5\eclipse\
MacOS uses a similar directory structure.
Note: For Windows Vista and Windows 7 only you will need to run Flash Builder 4.01 as Administrator. Find Flash Builder 4 in the Programs menu, right click on it and select “Run as administrator”. This is not neccesary if you are using Flash Builder 4.5.
You can test your installation by creating your first Navigator project.
I have an adobe file that has been set up as a portfolio. The problem is that when the file is opened, it stays on the main document for a few seconds and then jumps to the attached file. Is there anyway to stop this from happening?
Please send me the file so I can get a better understanding of what’s happening.
Or any way to get back to the original document?
Can you elaborate? I’m not sure what you’re asking.
Adobe Acrobat Pro X or later [download free trial]
Adobe Flash Builder 4.0.1 or higher [download free trial of FB 4.5]
Adobe Flex 4.1 SDK [free download]
Adobe Acrobat Portfolio SDK [free download]
how to install the adobe flex 4.1 SDK ?.
There’s a great YouTube tutorial here
http://www.youtube.com/watch?v=OhHxPK_p2jQ
Joel,
I’m the Clerk of the Board of Education for Wichita Public Schools in Wichita KS. We publish our BOE Agendas from 2009-present in Adobe Portfolio using Adobe Acrobat Professional 9. This year, I upgraded to Adobe X and discovered that the Adobe Acrobat 9 portfolio titled “Grid with File Preview” is not available in Adobe Acrobat X Pro. I have contacted Adobe Support twice in the past several months, and their response is that a custom layout “.nav” file can be created and imported into Adobe Acrobat X Prof. Could you please direct me to someone who could help in this regard. Thank you.
Take a look at Practical:PDF
http://blog.practicalpdf.com/
I have a great PDF Portfolio idea for training that includes an Agenda which links each item to a certain page in a PDF file within the Portfolio. What I do is open the portfolio, open the Agenda, and place them side-by-side. When you click an item in the Agenda on the left, the corresponding info appears on the right. The audience is not always technical enough to get the view to that point, and often accidentally maximize one of the windows or need a lot of TLC to get the views to that point. I’d like a script that would automatically open the PDF Portfolio to a view with my Agenda.pdf on the left and the rest of the portfolio on the right. Any suggestions? Been struggling with this. I’ve taken some scripting languages, but I’m new at it.
A PDF Portfolio is probably not the right solution for this use case. You’re always going to have the Acrobat chrome around that will allow users to minimize a window accidentally. You might consider using Adobe AIR for this sort of thing.
Lori,
I downloaded Joel Garcia’s sample Billboard template, like the welcome screen but would like the grid layout. Is the Billboard sample.pdf available in something I can import and modify to get the welcome screen and the grid?
thank you
It’s not possible to modify an existing layout with new components but Joel, who is no longer with Adobe, is doing some interesting things at http://blog.practicalpdf.com/portfolios/
I have created a PDF portfolio and customised it. I now wish to package it inside Adobe AIR so that it can be distributed on CD and the user can install it to their desktop.
Many thanks
I’m not sure what the advantage is of packaging it in AIR. Can you elaborate?