Skip to main content

Theme Setup

Add PDF Connect Theme App Extensions to your Shopify theme so customers can see PDFs on your storefront.

Why theme setup matters​

Linking PDFs and setting them to active isn't enough. You must add Theme App Extensions to your theme for PDFs to appear on your store.

Think of it like this:

  • Linking = Connecting PDFs to pages/resources
  • Theme App Extensions = Making PDFs visible to customers in the theme editor. Only required once per template.

Both are required to show a PDF on your storefront.

Just a config step in your PDF setup!

Two ways to publish​

The fastest way to add a Theme App Extension:

  1. Open the Publish section in the PDF details page
  2. If the Theme App Extension is not yet added to the theme template, you'll see a prompt to Publish
  3. Click Publish and choose the display style (Embedded Viewer or Button)
  4. A new tab or window opens to your theme editor with the extension already added
  5. Adjust the extension settings if needed, then click Save in the theme editor

2. Add a Theme App Extension manually via the theme editor​

For more control over extension placement:

  1. Go to Online Store > Themes
  2. Click Customize on your active theme
  3. Navigate to a page where you've linked a PDF (e.g., a product page)
  4. Click Add section or Add block (depends on your theme)
  5. Look for PDF Connect in the Apps section
  6. Add either PDF Embedded Viewer or PDF Button
  7. Click Save

Or see Customize display options β†’

Where to find PDF Connect Theme App Extensions​

PDF Connect Theme App Extensions appear under Apps in your theme editor. Look for:

  • PDF Embedded Viewer - Shows PDFs inline on the page
  • PDF Button - Shows clickable buttons that open PDFs in overlay

Both extensions are available for all supported page types.

Supported page types​

Add PDF Connect extensions to these page templates:

  • Product pages - Product template editor
  • Collection pages - Collection template editor
  • Pages - Page template editor
  • Blog - Blog template editor
  • Articles - Blog Article template editor
  • Homepage - Index template editor
  • Search page - Search template editor

Position your extensions​

Control where PDFs appear:

Product pages:

  • Above Add to Cart button
  • In a separate tab
  • Below product description
  • In sidebar

Collection pages:

  • Above product grid
  • Below collection description
  • In sidebar

Other pages:

  • Above main content
  • Below main content
  • In dedicated sections

Position depends on your theme's section structure.

One extension shows all linked PDFs​

You only need to add one Theme App Extension per page type:

  • Add PDF Button extension to product template
  • Extension automatically shows PDFs for every product
  • Displays only PDFs linked to that specific product
  • No need to add extensions to individual products
  • If you need to exclude a PDF see Display PDF by Extension Type β†’

Same applies to collections, pages, and other resources.

Theme App Extension settings​

Customize how extensions appear on your page (not the PDF viewer features):

For Embedded Viewer extension:

  • Show heading (toggle)
  • Heading text
  • Viewer height (percentage of viewport, desktop only)
  • Show container border

For PDF Button extension:

  • Show heading (toggle)
  • Heading text
  • Button text and text source (generic, PDF name, or description)
  • Button alignment (left, center, right)
  • Button text alignment
  • Multiple PDFs layout (vertical or horizontal)
  • Show PDF icon
  • Show container border
  • Button background color
  • Button text color
  • Button hover background color
  • PDF viewer modal size (60%, 70%, 80%, 90%)

For PDF viewer features (zoom, download, toolbar, navigation, etc.), configure those in the app's PDF details page. Learn about viewer configuration β†’

Mix display styles​

You can use different display styles on different page types:

  • Embedded viewer on product pages
  • Button display on collection pages
  • Embedded on homepage

Or mix them on the same page if your theme allows multiple extensions.

Themes without Theme App Extension support​

Older or custom themes might not support Theme App Extensions:

  1. Check if your theme is compatible with Theme App Extensions
  2. Update to a newer theme version if needed
  3. Contact theme developer for support
  4. Consider switching to an Online Store 2.0 compatible theme

Most modern Shopify themes (Online Store 2.0) support Theme App Extensions.

Preview before publishing​

Test your setup before going live:

  1. Add extensions in theme editor
  2. Use the preview to see how PDFs look
  3. Try both display styles
  4. Check on mobile preview
  5. Make adjustments as needed
  6. Click Save when satisfied

Remove extensions​

To remove PDF display from a page type:

  1. Go to theme editor
  2. Navigate to that page type
  3. Find the PDF Connect extension
  4. Click the extension settings
  5. Choose Remove block
  6. Click Save

This hides PDFs without unlinking them.

Troubleshooting display issues​

PDFs don't appear:

  • Verify extension is added to correct page type
  • Check PDF status is Active
  • Confirm PDF is linked to the resource
  • Refresh the page

Extension not in Apps section:

  • Theme might not support Theme App Extensions
  • Try updating theme
  • Check theme compatibility (requires Online Store 2.0)

Wrong PDFs showing:

  • Verify you're viewing the correct resource
  • Check linking in PDF library
  • Review template filters (if used)

View full troubleshooting guide β†’

Next steps​