Skip to main content

Embedded viewer

Show PDFs directly on the page with full navigation controls.

What the embedded viewer does​

The embedded viewer displays your PDF right on the page. Customers can read, scroll, zoom, and navigate pages without leaving your store.

PDF viewer configuration​

Before adding the embedded extension, choose which PDF viewer to use. This is configured in the app's PDF details page under Viewer Configuration:

Custom Viewer (Full Featured)

  • Full-featured PDF viewer with all navigation controls
  • Search functionality, zoom tools, customizable display options
  • Mobile-optimized viewing
  • Configure: Initial page, zoom level, page layout, scroll direction
  • Enable/disable: Download, toolbar, image stamps, highlighter, drawing tools, text selection

Light Viewer (Fast & Simple)

  • Simple, fast-loading viewer with minimal interface
  • Perfect for quick document preview
  • Mobile-optimized
  • No configuration options - just works

Flipbook Viewer (Interactive Pages)

  • Interactive page-flipping experience
  • Mimics reading a physical book or magazine
  • Great for catalogs, brochures, marketing materials
  • Not mobile-optimized
  • Configure: Animation style, page shadows, background color

The viewer type you choose applies to ALL Theme App Extensions (both button and embedded) for that PDF.

How it looks​

The embedded viewer displays the PDF directly on the page using your chosen viewer configuration:

Custom Viewer shows:

  • Full PDF content with navigation toolbar
  • Page controls (previous/next, zoom)
  • Search functionality
  • Download/print buttons (if enabled)
  • Customizable features based on your settings

Light Viewer shows:

  • Simple PDF display
  • Basic navigation
  • Minimal interface for fast loading

Flipbook Viewer shows:

  • Page-flipping animation
  • Book-like reading experience
  • Interactive page turns

When to use embedded viewer​

Best for:

  • Long documents customers should read on your site
  • Technical specs that need zooming
  • Catalogs where browsing is important
  • Pages with room for the viewer
  • Desktop-focused content

Not ideal for:

  • Short PDFs (use button instead)
  • Mobile-first stores (can be cramped)
  • Pages with limited space
  • When you have many PDFs on one page

Add embedded viewer to your theme​

  1. Go to Online Store > Themes
  2. Click Customize on your active theme
  3. Navigate to the page where you want PDFs to appear
  4. Click Add section or Add block
  5. Find PDF Connect under Apps
  6. Select PDF Embedded Viewer
  7. Click Save

Customize the embedded extension​

In the theme editor, you can customize how the embedded viewer appears on your page:

Show heading - Toggle section heading on/off

Heading text - Customize the section title (e.g., "PDF Documents")

Viewer height - Set height as percentage of viewport (desktop only, mobile uses full screen)

Show container border - Add border around the viewer

These settings control the extension layout and styling only. The actual PDF viewer features (zoom, download, toolbar, navigation, etc.) are configured in the app's Viewer Configuration section for each PDF.

Multiple PDFs with embedded viewer​

If you link multiple PDFs to one page, the embedded viewer shows them stacked vertically:

  • First PDF displays in first viewer
  • Second PDF displays in second viewer
  • Customers scroll down to see each one

This can make pages very long. Consider using button display for multiple PDFs instead.

Embedded viewer on mobile​

The viewer adapts to mobile screens but:

  • Takes up significant vertical space
  • Zoom controls can be small
  • Scrolling inside the viewer can be tricky
  • Consider using button display for mobile-first stores

Viewer features​

Zoom - Customers can zoom in and out

Page navigation - Jump to specific pages

Search - Find text within the PDF (some viewers)

Download - Save PDF to their device (if enabled)

Print - Print directly from the viewer (if enabled)

Performance tips​

Optimize PDF size - Files under 5MB load fastest

Lazy loading - Viewer loads only when visible on page

Thumbnail quality - First page loads before full PDF

Mobile consideration - Larger files may load slowly on mobile data

Next steps​