Skip to content

Gravity PDF

Gravity PDF is a popular PDF-generation plugin for Gravity Forms, and Image Hopper is natively supported in the Core (free templates) and Universal PDFs. To prevent PDF-generation issues when displaying images, we recommend adjusting the Image Hopper downscale and quality settings. This will keep the image file size lower, so you can still send the PDFs as email attachments (many mail servers have an attachment size limit, some as low as 10MB).

A webpage displays a PDF document containing a 3x3 grid of artwork images uploaded through the Image Hopper field in a form. The PDF is rendered within a web browser window.

Pro tip: if you limit the Image Hopper field to 1 image you can use the {Field Name:2:raw} merge tag in the Background Image PDF setting (available in the Template section of some PDF templates) to use the uploaded image as a full-page background.

Image Grid

To create multi-column image grids within your Gravity PDFs, use Image Hopper fields in your Gravity Forms. Add the following CSS Ready Classes to the Custom CSS Class field, located under the Appearance tab in the field’s settings:

  • 2 Columns: gf_list_2col
  • 3 Columns: gf_list_3col
  • 4 Columns: gf_list_4col
  • 5 Columns: gf_list_5col
On the left is a screenshot of a form that displays two Image Hopper fields, each containing multiple uploaded images. On the right, a preview of the generated PDF document shows these images arranged in various grid layouts. A pink arrow connects the form to the PDF output.

Applying these classes will automatically arrange uploaded images into the specified grid layout within your generated PDFs.

Previewer Add-on

The Gravity PDF Previewer add-on allows generated documents to be viewed on screen before the form is submitted. Image Hopper is fully supported, either on the same page as the Previewer or on an earlier page in the form.