Skip to content

andrewklimek/formidable-pro-pdf-extended

 
 

Repository files navigation

Formidable Pro PDF Extended

Formidable Pro PDF Extended is a Wordpress plugin that allows you to save/view/download a PDF from the front- and back-end, and automate PDF creation on form submission.

This is an updated version of the original, abandoned project.

The underlying PDF engine (mPDF) has been upgraded from 5.7.1 (Sep 2013) to 8.1 (Apr 2021) and tested with current versions of Wordpress and Formidable Forms.

=======

Documentation

What is Formidable Pro PDF Extended?

Formidable Pro PDF Extended was based upon the WordPress plugin Gravity Forms PDF Extended, now known as GravityPDF that allows developers to quickly take data captured from Formidable Forms Pro and generate and email or download a PDF document using nothing more than HTML and CSS. Powering this system is the feature-rich HTML-to-PDF package, mPDF.

What does mPDF offer?

mPDF supports the following features:

  • Language Support – almost all languages are supported including RTL (right to left) languages like Arabic and Hebrew and CJK languages – Chinese, Japanese and Korean.
  • Page Numbering
  • Odd and even paging with mirrored margins (most commonly used in printing).
  • Nested Tables
  • Text-justification and hyphenation
  • Table of Contents
  • Index
  • Bookmarks
  • Watermarks
  • Password protection
  • UTF-8 encoded HTML
  • Better system resource handling

To see exactly what mPDF is capable of view the custom template examples below.

Requirements

Formidable Pro PDF Extended has the following conditions that must be met to use the package:

Software Requirements

Server Requirements

RAM

  • Minimum: 64MB (128MB recommended)

Instructions

Installation

  1. Download Formidable Pro PDF Extended, upload the plugin to your website’s plugins folder and activate it.
  2. Open the PDF tab under the Formidable Forms Global Settings sub-menu.
  3. Click on Initialize Plugin to perform initial setup. As this copies the required templates and configuration files into your current theme folder, it is recommended to use a child theme.
  4. Open up /wp-content/themes/%ACTIVE_THEME%/FORMIDABLE_PDF_TEMPLATES/configuration.php and configure accordingly. The configuration section below will aid you setting up the plugin.
  5. If you want to use a custom template to generate your PDFs then see our comprehensive guide to building a PDF template.

Basic Usage

It is very easy to generate PDFs and have them attached to a Formidable Forms Pro action or notification. The following will send the default PDF template to all form notifications. Automatically adding to notifications through the configuration file doesn't work. Steps for adding through the Formidable Forms GUI is described below.

/* NOTE: Adding notfication actions via configuration file not currently working */
/* send default template to all attachments */
	$fp_pdf_config[] = array(
	'form_id' => 1,
	'notifications' => true
	);

Assuming that the form being submitted contains the fields you wish to include in the PDF, and therefore that the Entry is the one currently being submitted:

  1. Find your Form ID (fid), e.g. 1
  2. For your Entry ID (lid) use [id].
  3. Choose your template, e.g. default-template.php
  4. Under your form settings, change On Submit to Display Message, and add a hyperlink using the [pdf] shortcode, or with the following link format if you wish to customize it using additional classes or markup: PDF. See link features and limitations below.

To prevent unwanted users accessing sensitive data each PDF displayed using this method will check two things:

  1. If the user is logged in and has read privileges of Formidable Pro entries, or
  2. If the user’s IP address matches the IP address on file for the entry.

There are many other ways you can use this plugin. Other than generating a PDF directly from a form input and adding a link to the form submit message as described above, you can add the link to a form action (such as sending an email), display a PDF link in a view, or even embed a generated PDF in a view.

GLOBAL DEFAULTS

You can set default configuration options for all forms that you haven’t explicitly set a configuration for by modifying the configuration file /wp-content/theme/%ACTIVE_THEME%/FORMIDABLE_PDF_TEMPLATES/configuration.php. This file, which also contains examples of all the options documented below, will be created after plugin deployment (step 3 of installation, explained above).

 $fp_pdf_default_configuration = array(
 	'template' => 'default-template.php',
	'pdf_size' => 'A4',	
  	'orientation' => 'landscape',
 ); 

Default configuration support can be disabled by setting the configuration option FPPDF_SET_DEFAULT_TEMPLATE to false.

INDIVIDUAL TEMPLATE DEFAULTS

You can also set default options for specific templates and forms as follows:

/* set individual default options for templates */
	$fp_pdf_config[] = array(
	'form_id' => 1,
	'template' => 'default-template.php',
	'default-show-html' => true,
	);

	$fp_pdf_config[] = array(
	'form_id' => 1,
	'template' => 'custom-template.php',
	'default-show-empty' => true,
	);

	/*
	 * Or use a combination of options
	 */
	$fp_pdf_config[] = array(
	'form_id' => 1,
	'template' => 'default-template.php',
	'default-show-html' => true,
	'default-show-empty' => true,
	'rtl' => true,
	);

CONFIGURATION OPTIONS

All of these can be specified as global defaults, template defaults, or as shortcode options.

Option Instructions
default-show-html Displays HTML blocks in your template.
default-show-empty Displays all form fields regardless of user input.
filename Customize the PDF filename. You can set the PDF name of your document and use field ID/Keys in your filename ([sitename], [ip], [id], [key], [20], [ltzq9]). Remember to add .pdf to the end of your custom PDF name. $fp_pdf_config[] = array( 'form_id' => 1, 'filename' => 'User Document.pdf' ); $fp_pdf_config[] = array( 'form_id' => 1, 'filename' => 'New PDF Name [id].pdf' );

Setting options in configuration file

Custom PDF Filename

You can set the PDF name of your document and use field ID/Keys in your filename ([sitename], [ip], [id], [key], [20], [ltzq9]). Note: Remember to add .pdf to the end of your custom PDF name.

$fp_pdf_config[] = array(
	'form_id' => 1,
	'filename' => 'User Document.pdf'
	);

$fp_pdf_config[] = array(
	'form_id' => 1, 
	'filename' => 'New PDF Name [id].pdf' 
	);

Custom Template

Please see our dedicated documentation page which discusses the creation of custom template files.
You can set the custom template using the template parameter.

$fp_pdf_config[] = array(
	'form_id' => 1,
	'template' => 'example-template.php'
	);

Custom Page Size

Change the default size of your PDF to a number of pre-defined sizes using the ISO Code or U.S. Paper Size. Supported page sizes: A0 – A10, B0 – B10, C0 – C10, 4A0, 2A0, RA0 – RA4, SRA0 – SRA4, Letter, Legal, Executive, Folio, Demy and Royal, as well an array of height and width.

/* generate a PDF the size of US letter in landscape */
	$fp_pdf_config[] = array(
	'form_id' => 1,
	'pdf_size' => 'letter',
	);

	/* generate a custom PDF (specified in millimeters) */
	$fp_pdf_config[] = array(
	'form_id' => 1,
	'pdf_size' => array(150, 250)
	);

Custom Page Orientation

Specify the page orientation of the PDF. Supported orientations: portrait, landscape

/* generate a PDF in landscape */
	$fp_pdf_config[] = array(
	'form_id' => 1,
	'orientation' => 'landscape',
	);

Language Direction Support

If you are generating PDFs in RTL languages like Arabic or Hebrew you can call the RTL parameter to correctly display text in your PDF.

$fp_pdf_config[] = array(
	'form_id' => 1,
	'rtl' => true
	);

PDF Security

You can easily restrict access to your PDFs by restricting user permission and applying a password to access the document, or modify PDF permissions. To enable these security methods you first need to set the security setting to true.

  • If security is set to true and pdf_master_password is omitted a random password will be generated.
  • The use of print will only allow low-resolution printing from the document; you must specify print-highres to allow full resolution printing.
  • Passing a blank array or not passing anything to pdf_privileges will deny all permissions to the user.

Supported options: copy, print, modify, annot-forms, fill-forms, extract, assemble, print-highres

/*
	\* Setting security settings with all values */
	$fp_pdf_config[] = array(
	'form_id' => 1,
	'notifications' => true,
	'security' => true,
	'pdf_password' => 'myPDFpass',
	'pdf_privileges' => array('copy', 'print', 'modify', 'annot-forms', 'fill-forms', 'extract', 'assemble', 'print-highres'),
	'pdf_master_password' => 'admin password'
	);

Advanced Usage

You can generate and attach multiple PDFs on the same form by creating two different configuration arrays using the same form_id.

Note: You need to explicitly set the filename when using this method otherwise the default file name will be used and only generate one PDF.

$fp_pdf_config[] = array(
	'form_id' => 1,
	'notifications' => true,
	'template' => 'custom-template.php',
	'filename' => 'Custom.pdf'
	);

	$fp_pdf_config[] = array(
	'form_id' => 1,
	'notifications' => true,
	'template' => 'custom2.php',
	'filename' => 'Custom Template 2.pdf'
	);

PUTTING IT ALL TOGETHER

We’ve put together an example that uses all the configuration options (minus the default template-specific options) for Formidable Pro PDF Extended.

$fp_pdf_config[] = array(
	'form_id' => 1,
	'notifications' => array(1, 2),
	'template' => 'custom-template.php',
	'filename' => 'My_Custom_PDF.pdf',

	'rtl' => true,

	'pdfsize' => 'A10',
	'orientation' => 'landscape',

	'security' => true,
	'pdf_password' => 'mypass',
	'pdf_privileges' => array('print', 'fill-forms', 'print-highres'),
	'pdf_master_password' => 'admin password'
	);

Advanced Configuration

At the bottom of the configuration.php file are a number of constants that modify advanced program settings – most related to reducing the software’s memory footprint. View the memory footprint portion of the documentation for more information about reducing memory usage.

Option Instructions
default-show-html Displays HTML blocks in your template.
default-show-empty Displays all form fields regardless of user input.
filename Customize the PDF filename. You can set the PDF name of your document and use field ID/Keys in your filename ([sitename], [ip], [id], [key], [20], [ltzq9]). Note: Remember to add .pdf to the end of your custom PDF name. $fp_pdf_config[] = array( 'form_id' => 1, 'filename' => 'User Document.pdf' ); $fp_pdf_config[] = array( 'form_id' => 1, 'filename' => 'New PDF Name [id].pdf' );

Setting options using shortcode

One of the unique features of Formidable Pro is the ability to create custom views. To take advantage of this, we’ve created a shortcode called [pdf] which securely displays a link to a PDF associated with the current entry in a view. Using the shortcode without specifying any options will use the global default options and any optionis specified for the current Form ID in the configuration file. See link features and limitations below.

Shortcode Usage

The shortcode can only be used in custom views, not inside pages or posts directly. We’ve made the shortcode as robust as possible. Users can change the template file used, choose whether the PDF should be viewed in the browser or download and change the link text.

By default, the shortcode will:

  • Use the template assigned to the form in the configuration.php
  • Display the PDF inline or
  • Display a link to the PDF saying ‘View PDF’

Standard shortcode usage

[pdf]

Use a different PDF template that what is set in the configuration.php file

[pdf template="example-template.php"]

Use the default template and link text but force the browser to download the PDF

[pdf download="1"]

Change the link text

[pdf]Click here to view PDF[/pdf]

Putting it all together

[pdf template="example-template.php" download="1"]Click here to view PDF[/pdf]

Customization

Custom CSS

The following are supported (in order of ascending priority). Lower styles and attributes in the list will overwrite higher styles and attributes.

  • CSS Stylesheets – included in header of HTML document using <style></style>, as <link  /> or using @import()
    • Html tags – p { font-size:12pt; color:#880000; }
    • Class – .stylename { font-size:9pt; }
    • Id – #style { font-size:9pt; }
  • HTML attributes – <div align=”center”>
  • Inline CSS style – <p style=”font-family:monospace;”>

CSS attributes used in stylesheets or inline can define:

  • Most tags and elements such as div, p, body, table, span
  • Class names – p.mystylename { font-size:9pt; }
  • ID – div#style { font-size:9pt; }

See CSS limitations below, and please review the extensive mPDF manual for a full list of supported CSS properties.

Custom HTML

Note: All HTML elements are hard coded as block or inline elements. This cannot be changed using CSS’s ‘display’ property.

View all supported HTML tags and attributes.

Custom Fonts

Fonts Language Support

By way of mPDF, the plugin comes with a number of unicode fonts and by default will substitute a font if the specific character isn’t available, so you should be safe using the default font selection – DejaVuSans. However, if you want to output PDFs in Japanese, Korean or Chinese you will need to install additional fonts.

Available Fonts

Note: By default the package uses the unicode font DejaVuSans which has characters available for most languages worldwide.

The following open source fonts are available with Formidable Pro PDF Extended and should cover the majority of languages worldwide:

  • DejaVuSans, DejaVuSansCondensed, DejaVuSansMono, DejaVuSerif, DejaVuSerifCondensed
  • Garuda – Thai (sans-serif)
  • Norasi – Thai (serif)
  • XBZar, XBRiyaz – Arabic

CJK Font Support

Formidable Pro PDF Extended doesn’t support Chinese, Japanese or Korean languages out of the box due to licensing restrictions (or rather lack of a license). If you need CJK support you will need to manually download Sun-ExtA, Sun-ExtB and UnBatang and upload the .ttf files to your active theme’s FORMIDABLE_PDF_TEMPLATES/fonts/ folder. Once uploaded, you can install the fonts through the plugin’s settings page (Forms -> Settings -> PDF) by clicking Initialise Fonts Only.

After installation you can use the new fonts by setting the font-family CSS property:

  • font-family: UnBatang, dejavusanscondensed, sans-serif;
  • font-family: sun-exta, dejavusanscondensed, sans-serif;
  • font-family: sun-extb, dejavusanscondensed, sans-serif;

CJK Fonts Download

Download all three fonts below and upload them to your active theme’s FORMIDABLE_PDF_TEMPLATES/fonts/ folder.

For a full overview of which languages each font supports please view the mPDF documentation.

Installing Custom Fonts

You can install your own font files with a few limitations and user them in your PDFs.

Installing your custom font is as easy as placing your .ttf file in the FORMIDABLE_PDF_TEMPLATES/fonts/ folder, which is located in your active theme. Once uploaded, you can install the fonts through the plugin’s settings page (Formidable -> Global Settings PDF) by clicking Initialise Fonts Only.

Using Custom Fonts

After installation you can use the new fonts as usual by selecting them with the font-family CSS property. Your font family name will be the name of your font file (minus .ttf). For instance, if you upload a file called Mefis.ttf the font family name would be Mefis.

/* Apply my new font to the entire PDF
 * Note: It's important to include a font-family type at the end of your font chain (in this example it is sans-serif) in case your font doesn't contain a character your user has used. By default, the plugin will substitute those characters out for one this is supported.
 */
	
	body {
	font-family: Mefis, Arial, sans-serif;
	}

Custom Templates

Getting Started

Creating a custom template gives you ultimate control of your PDF documents, and is necessary if you wish to include any data from your form. Custom templates allow you to use HTML and CSS to control the look and feel of your document, and by adding some PHP to integrate Formidable Form fields, you’ve got a custom PDF document tailored to your needs.

Creating your first template

Locate the sample template files located in your active theme’s FORMIDABLE_PDF_TEMPLATES folder, and make a copy with your chosen filename to start customization.

When we are developing template files we like to get all the Formidable Pro data first and work from there. To do this you can and append ‘&data=1′ to the end of the URL while viewing any of the example template files through the admin area (change template=default-template.php in the URL to a custom template file). This will output the entire $form_data array which you can use throughout your custom template. Note: Adding &data=1 to the default template files won’t show you the $form_data array; it will only work with templates labelled ‘example-‘.

Adding Formidable Form Fields to Your Template

The form fields can be accessed through a multidimensional associative array called $form_data_array, examples of which can be found below. You will need to make a note of the field IDs from your form, as the plugin uses field IDs for accessing field data, and does not support using field keys.

Examples of accessing $form_data array

/* Getting generic information about the entry */
	<?php echo $form_data['form_title']; ?>
	<?php echo $form_data['date_created']; ?>
	<?php echo $form_data['date_created_usa']; ?>

	<?php echo $form_data['misc']['created_at']; ?>
	<?php echo $form_data['misc']['updated_at']; ?>
	<?php echo $form_data['misc']['user_id']; ?>
	<?php echo $form_data['misc']['post_id']; ?>
	<?php echo $form_data['misc']['description']['browser']; ?>
	<?php echo $form_data['misc']['description']['referrer']; ?>
	<?php echo $form_data['misc']['ip']; ?>
	<?php echo $form_data['misc']['parent_item_id']; ?>

	/* Getting standard input title and value */
	<?php echo $form_data['field']['d6k1qj']['title']; ?>
	<?php echo $form_data['field']['d6k1qj']['value']; ?>

	/* Accessing Checkboxes and Dropdowns */
	<?php echo $form_data['field']['v502o9']['string']; ?>
	<?php foreach($form_data['field']['v502o9']['value'] as $checkbox) {
	echo $checkbox . ' ';
	} ?>

	/* You can also access the full list of options from those fields */
	<?php print_r($form_data['field']['v502o9']['options']); ?>

	/* Accessing Upload Field Values */
	<?php echo $form_data['field']['vdq4wo']['name']; ?>
	<?php echo $form_data['field']['vdq4wo']['url']; ?>
	<?php echo $form_data['field']['vdq4wo']['path']; ?>

	/* Accessing Signature Data */
	<?php echo $form_data['signature']['n4sfhv']['img']; ?>
	<?php echo $form_data['signature']['n4sfhv']['url']; ?>
	<?php echo $form_data['signature']['n4sfhv']['path']; ?>

	/* Accessing Formidable Plus table data */
	<?php echo $form_data['field']['uvhlcl']['title']; ?>
	<?php echo $form_data['field']['uvhlcl']['table_html']; ?>

	/* You can also loop through the columns and rows to build your own table using the table_cells and table_data arrays */
	/* Note: index 0 of table_cells is the column names and index 1 is the row names */
	<?php print_r($form_data['field']['uvhlcl']['table_cells']); ?>
	<?php print_r($form_data['field']['uvhlcl']['table_data']); ?>

Once you have your form data you can start developing your custom template. Copy and rename one of the example template files which are all prepended with ‘example-‘. There are a number of example template files for you to use and we’ve documented them all in the next steps.

What’s next?

Once you have created your custom template you will need to select it within your configuration file or with your shortcode.

Basic Custom Template Configuration Example

$fp_pdf_config[] = array(
	'form_id' => 1,
	'template' => 'my-custom-template.php'
	);

or [pdf template="my-custom-template.php']

For more information about configuring the plugin and configuring your template options see the Installation and Configuration documentation.

Quick tip: Administrators and Editors can quickly view different custom templates in their browser by appending &template=template-name.php to the URL when viewing PDFs via the admin area, e.g. https://www.example.com/?pdf=1&fid=1&lid=102**&template=my-custom-template.php**

Included Templates

All example template files are located in your active theme’s FORMIDABLE_PDF_TEMPLATES folder. View the mPDF documentation to see the full list of supported HTML tags and attributes.

Basic HTML Template

Template: example-basic-html01.php

This is just straight HTML like you’re use to. The template shows most valid HTML elements that you can use when developing your custom template.

Gradients and Rounded Corners Template

Template: example-backgrounds-and-borders02.php

mPDF follows the CSS3 specification for defining gradients. You can use: background: linear-gradient(…) and background: radial-gradient(…) to define linear and radial gradients on all block-level elements. mPDF also supports border-radius so you can easily add rounded corners to your PDFs.

Gradients Example
/* start linear gradient from the bottom and render upwards – blue at bottom and white at the top */
	background: linear-gradient(bottom, #0b91c2, #FFFFFF);

	/* start linear gradient from the top and render downwards. #e1e1e1 will cover 65% of the area. */
	background: linear-gradient(top, #e1e1e1 65%, #c7c7c7);

	/* run a linear gradient at 45 degrees to the element. */
	background: linear-gradient(45deg, blue, yellow);

	/* Using three colours in the gradient and controlling the percentage they cover. */
	background: linear-gradient(top, blue, yellow %75, red %10);

	/*create a radial gradient with the circle in the centre */
	background: radial-gradient(center circle, red, green);

	/*create a radial gradient with the circle in the top left */
	background: radial-gradient(center circle, red, green);

	/* have the circle in the bottom left corner using three colours */
	background: radial-gradient(farthest-side at left bottom, red, yellow 50px, green);

Notes:

  • Background-colour and background-image set on the element will cover the whole page i.e. not inside the “margins”.
  • Background colour is the only property that can be set on inline elements. Background image and gradient can be set on block elements, @page and the body element.
  • Background-images support JPG, GIF, PNG, WMF and SVG images.
  • You can view the W3 specification which details the usage of these CSS statements.
Rounded Corners Example

You can use the default border radius syntax to define all corners:

border-radius: 4em;

Which is equivalent to:

border-top-left-radius:     4em;
border-top-right-radius:    4em;
border-bottom-right-radius: 4em;
border-bottom-left-radius:  4em;

For more details about background images/gradients and border radius support please view the mPDF documentation.

Images Template

Template: example-images03.php

The image example displays all supported image formats (including GIF, PNG, JPG, WMF, SVG, BMP) in mPDF, as well as demonstrating additional supported CSS properties like opacity and rotate. Note that all images in mPDF are rendered as inline elements.

Note: Images can be memory intensive. If you are concerned about performance consider using the JPG format.

Images Examples

Along with using the standard tag in your template the following additional use cases apply:

Note:

  • Images in the header and footer can extend beyond the margin. You may consider using the @page CSS element to create suitable margins.

Tables Template

Template: example-tables04.php

mPDF includes some advanced table-based features include auto scaling if tables extend past the PDF width, 90 degree rotation and nesting tables.

Rotating Tables

Tables can be rotated 90 degrees so they fit nicely on portrait documents. This feature can be applied using the CSS style rotate:90|-90; property.

table {
	rotate: 90:-90;
	}

Autosizing Tables

If a table’s minimum width is too wide for the outer container it will automatically reduce the font size in order to fit. The minimum width is calculated by the sum of column widths required to fit the longest single word in the column.

Note: mPDF’s auto sizing function is smart and has a minimum font-size set in its configuration that prevents the font size from shrinking so much that it’s unreadable.

If you want to disable autosizing for a particular table you can add the autosize=”1” attribute to the table element – <table autosize=”1″>

Repeating Table Headers and Footers

If a table extends across multiple pages the <thead>…</thead> and <tfoot>…</tfoot> elements will be appended and prepended to the top and bottom of the table on each page. This can be seen in the example-tables04.php template.

Please read the mPDF table documentation for additional details on table configuration.

Floats and Fixed Positioning Template

Template: example-float-and-positioning05.php

Floats are partially supported and fixed positioning is partially supported in mPDF but don't conform to all requirements of the W3 CSS2 specification.

Rotating Positioned Elements

Like the CSS table ‘rotate’ property, positioned elements can also be rotated 90 degrees.

.class {
	rotate: 90|-90;
	}

Notes:

  • The width set doesn’t include padding, margin or border so if you have two floats with width=50% and either of them has padding, margin or border, they will not fit side by side on the page.
  • The CSS property ‘clear’ can be set on all block elements and
    or
    .
  • Please see the mPDF Documentation for more information:

Headers and Footers Templates

Templates

  • example-header-and-footer_06.php
  • example-advanced-headers_07.php

mPDF has advanced header and footer control that allows you to display the page number, total number of pages and alternate the header and footer based on a page’s ID or odd and even value.

Note: See mPDF replaceable aliases for more information about displaying the current page number and total pages.

Basic Example

Headers and footers should be defined right after the tag of the document before any other HTML is outputted. mPDF uses the custom HTML element and to generate PDF header and footer templates. Once defined they should be set with and , respectively.

<htmlpageheader name=”CustomName”>…</htmlpageheader>

Note: Do not name any header starting with html_. This prefix is reserved for use in @page.

This element allows you to define a header template for later use in the document. The attribute name is optional if only using one header template throughout the document. Everything inside the block will be rendered in the header.

Change Document Size Template

Example: example-different-page-size_08.php

mPDF allows the document size and layout to be changes on a per-page basis, giving you finite control over the output of your PDF document.

This feature can be controlled using the pagebreak tag or @page element. However the easiest way to do this is using and that is what we will cover.

Known Issues and Limitations

Link Features and Limitations

A PDF generated with Formidable Pro PDF Extended and inserted using a custom hyperlink can only be viewed by the original owner (matched against the user’s login ID or IP address) or a logged in user with the frm_view_entries role. Whereas links generated using the shortcode uses WordPress’ nonce system to generate secure URLs allowing non-authorised users to view the PDFs.

CSS Limitations

Block and Inline HTML

All HTML elements have been hardcoded to either block or inline elements. This cannot be changed with CSS (you can’t set display: block on an inline element).

Tables

Block elements (e.g. DIV or P) are not supported inside tables. The content is displayed, but any CSS properties which apply to block elements are ignored (e.g. borders, padding, margins etc).

Block Floating/Positioning

Blocks which are defined as position:absolute, fixed or float have only limited support.

CSS Selector and Cascade Limitations

The only pitfall we’ve experienced while using the mPDF package is the lack of cascading CSS, psudo-classes and CSS3 selector support. As a result, there is limited support for cascaded CSS but this can only be applied to standard block-level elements (you can’t set an inline element to block and use it in a cascading CSS selector).

Valid Cascading CSS

  • div.topic table.type1 td {…}
  • div #my-id {…}
  • table tr {…}
  • div p.style {…}

Invalid Cascading CSS

  • div.style a {…}
  • a#class1 {…}
  • span.class a {…}
  • body.class div {…}

We advise you keep your CSS selectors as simple as possible and assign a class or ID to the elements you need to target.

  • #my-id {…}
  • .my-class {…}

Custom Font Limitations

Custom fonts usage is limited by mPDF support, therefore:

  1. This plugin only supports Truetype fonts (.ttf)
  2. This plugin only supportts fonts that follow the Truetype specification and use Unicode mapping to the characters.
  3. This plugin provides no guarantee any particular font will work as expected.

Image Float Limitatioons

There is partial support for floating images in mPDF however the following limitations apply:

  • You can only have one floated image left and one floated right per container.
  • Unlike your browser (which will overflow the image out of the container), the containing HTML element is extended at the bottom if necessary to enclose the floated image.
  • Floats are ignored if the image is too wide for the container, inside a table, columns are on, or div page-break-inside: avoid is set.

For more information about image support view the mPDF documentation.

Floats Limitations

  • Only block elements can be floated.
  • Floats only work if a width is set on the element
  • By default non-floated elements will have margins applied so they are inline with the floated elements – margin-left: {floatWidth}; is applied.

Positioning Limitations

The CSS property “position” supports the ‘fixed’ and ‘absolute’ options. The absolute parameter will treat the entire page as the containing element while fixed is bound to the margin container.

  • Only block-level elements can be positioned.
  • All positioning is relative to the current page.
  • Setting ‘overflow: auto’ causes text to auto fit within the block size.
  • You cannot nest fixed position or floated elements inside other fixed position elements.

Note: Using overflow:auto can cause mPDF to be very slow as it attempts to write the same HTML reiteratively until it finds a reasonable fit to the available size.

Corrupt PDF File

This is usually caused by PHP errors generated while the PDF is created. The easiest fix is to turn off PHP error reporting and log the errors to a file (something that should be done in all production environments).

To debug the issue save the PDF to disk and open it up in a text document. The start of the PDF should contain an error message which will help narrow down the issue.

Text being replaced by random numbers / dates.

mPDF uses a number of reserved variables which can be inserted into a template and replaced when generating a PDF.

Blank Screen and no PDF

If you are getting a blank screen when attempting to generate a PDF there may be a script error. Set WP_DEBUG to true in your wp-config.php file and try view the PDF again.

Memory Problems

Formidable Pro PDF Extended is very memory intensive and it isn’t uncommon to have memory issues on shared hosting services. The best way to solve memory issues is to increase memory to the recommended 128MB but this isn’t always possible.

Things you can do

Note: All the following constants are located at the bottom of the configuration.php file which is located in your active theme’s FORMIDABLE_PDF_TEMPLATES folder.

  1. If your template uses a large tables you can set FP_PDF_ENABLE_SIMPLE_TABLES to true which will simplify them.
  2. Another option is to set FP_PDF_DISABLE_FONT_SUBSTITUTION to true which will embed the full font file directly into the PDF. This has the negative impact of increasing the PDF’s total size. PDFs displaying only English can negate this effect by setting the font to Helvetica.

You should also keep in mind the following when creating your template files:

  1. If using images the best format to use is JPG, followed by PNGs that aren’t interlaced and have no alpha channel. Keep away from GIF files and interlaced or alpha channel PNGs as they require a lot more memory to process.
  2. Limit the number of fonts used – try stick to one. If you can, you should use the base PDF fonts – Times, Helvetica or Courier – which don’t need to be embedded into the PDF. Note: the base fonts have limited support for non-Western European languages.
  3. Instead of using HTML attributes to format the PDF you should use CSS styles.
  4. Don’t use the CSS property “overflow” as it will slow down the PDF generation time

Packages

No packages published

Languages

  • PHP 89.9%
  • CSS 6.9%
  • JavaScript 3.2%