![ARISE GTM logo grey.png]](https://arisegtm.com/hs-fs/hubfs/ARISE%20GTM%20logo%20grey.png?height=40&name=ARISE%20GTM%20logo%20grey.png){kind=small}
PDF Viewer & FlipBook Pro
Setup & Configuration Guide
Overview
PDF Viewer & FlipBook Pro adds animated page-turn effects (FlipBook mode), continuous scroll, double page spread, download and print buttons, page shadows, and flexible toolbar positioning.
What's Different from the Standard Version?
| Feature | Standard | Pro |
|---|---|---|
| Display modes | Single page only | FlipBook (animated), Continuous Scroll, Single Page |
| Page layout | Single page | Single or Double Page Spread |
| Download button | — | Allow visitors to download the original PDF |
| Print button | — | One-click print from the browser |
| Toolbar position | Bottom only | Top or Bottom |
| Page shadow | — | Configurable drop shadow on pages |
| Corner radius | — | Sharp, Slight, Rounded, or Pill |
Getting Started
- Open any page in the HubSpot editor.
- Search for PDF Viewer or FlipBook in the module panel.
- Drag it onto your page.
- Upload a PDF and choose your display mode.
Pro-Only Fields
PDF Configuration (Pro additions)
| Field | What it does |
|---|---|
| Display Mode | FlipBook — animated 3D page-turn. Continuous Scroll — all pages in a scrollable column. Single Page — one page at a time. |
| Page Layout | Single Page — one page fills the viewer. Double Page Spread — two pages side-by-side like an open book. |
Toolbar Controls (Pro additions)
| Field | What it does |
|---|---|
| Download button | Shows a download icon that saves the PDF to the visitor's computer. |
| Print button | Opens the browser's print dialog with the PDF. |
| Toolbar Position | Place the toolbar at the Top or Bottom of the viewer. |
Style (Pro additions)
| Field | What it does |
|---|---|
| Show page shadow | Adds a subtle drop shadow around rendered pages for a "floating paper" effect. |
| Corner Radius | Sharp (0px), Slight (4px), Rounded (8px), or Pill (16px). |
| UI Font | Customise the toolbar font. |
Display Modes Explained
FlipBook Mode — Pages turn with a CSS 3D perspective animation. In double spread mode, two pages show side-by-side with a book-spine effect. Best for: catalogues, magazines, brochures, portfolios.
Continuous Scroll Mode — All pages render in a vertical column. Visitors scroll naturally through the entire document. Best for: long reports, whitepapers, documentation.
Single Page Mode — One page at a time with previous/next navigation. Best for: presentations, slide decks.
Example Configurations
Product Catalogue: Display Mode: FlipBook, Page Layout: Double Page Spread, Download: ON, Print: ON, Page Shadow: ON
Technical Whitepaper: Display Mode: Continuous Scroll, Download: ON, Toolbar Position: Top
Investor Pitch Deck: Display Mode: Single Page, Download: OFF, Print: OFF, Fullscreen: ON
Tips
- FlipBook on mobile: The animation simplifies on smaller screens. Double spread automatically switches to single page on mobile.
- Large PDFs: For documents over 50 pages, consider Single Page or FlipBook rather than Continuous Scroll.
- Download control: Turn off the download button to keep content on your site only.
- Keyboard navigation: Arrow keys work when the cursor is hovering over the viewer.