Skip to content
Docs
Get Pro
Free

Elementor, Divi and Beaver Builder

Native Foliora Viewer and Foliora Library widgets for the three most used page builders.

1 min read Updated

On this page

Foliora loads its builder integrations only when the builder is active. Each builder gets two elements with the same options as the block and the same output as the shortcode.

Foliora ViewerOne PDF with view mode, size, start page and toolbar options.
Foliora LibraryA searchable grid of Media Library PDFs.

Elementor#

  1. Edit the page with Elementor.
  2. In the widget panel search “Foliora” or open the Foliora category.
  3. Drag Foliora Viewer or Foliora Library onto the page and pick a PDF in the Content tab.

Divi#

  1. Open the Visual Builder and add a module.
  2. Search for Foliora Viewer or Foliora Library.
  3. Set the PDF URL and options in the module settings.

Beaver Builder#

  1. Open the builder and the Modules panel.
  2. Find the Foliora group and drag in Foliora Viewer or Foliora Library.
  3. Fill in the General tab.

Other builders#

Any builder with a shortcode or HTML element works — paste [foliora file="…"]. If a viewer is added to the page after it loaded (tabs, popups, AJAX), start it with FolioraViewer.bind( element ). See DOM events & JavaScript API.

Viewers inside hidden tabs or accordions render best with loading="lazy": they start when they become visible.