Create HTML from template in Zapier or Power Automate
This article demonstrates how to generate HTML documents from a template with the help of Processes, a Plumsail Documents feature.
The Processes are a user-friendly intuitive interface for creating documents from templates, converting them, and delivering to different systems for further management.
In this article, we will generate an HTML invoice based on some data. This is how our final HTML file looks:
Here is a step-by-step description on how to create such a process of generating HTML documents from a template.
Configure Process
First, register or login to your Plumsail account.
Create new process
For this example, download the prepared HTML template for invoices.
During process creation, click Add Process and select Upload a document. Then select the downloaded invoice template.
Enter a Process name, leave HTML selected as the Output file type, and click Create.
If you prefer to create your own template, click Add Process and select Blank document instead.
Choose HTML as the Template type, leave HTML selected as the Output file type, and enter a Process name. Then click Create.
Configure template
Once the process is created, proceed to configure the template.
There are several template configuration options:
Editor: Where you design or upload your template.
Settings: Where you define the output format and filename.
Templating syntax
The template has placeholders like {{Total}} and {{Quantity}}.
The {{#each Items}} … {{/each}} block renders the invoice items. See the template syntax description for more information.
Test template
To preview the document before saving it, click Test template.
You will see a dialog where you can insert your data in JSON format. This data is used to populate the {{ }} placeholders in the template, so it must correspond to the template tokens.
To test the template from our example, you can copy and paste the JSON data shown below.
Note
This is JSON for testing. You can pass data from an external system or web form to the process. See the Start process section.
{
"InvoiceDate": "10/02/2017",
"InvoiceNum": 1,
"Total": 1098,
"ClientCompany": "Contoso ltd.",
"ClientName": "John Doe",
"ClientAddress": "55 East 52nd Street 21st",
"ClientCity": "New York",
"ClientRegion": "US",
"ClientZip": "10022",
"Items": [
{
"FieldValues": {
"Quantity": 1,
"SubTotal": 499,
"Title": "Product Name #1",
"UnitPrice": "499"
}
},
{
"FieldValues": {
"Quantity": 1,
"SubTotal": 599,
"Title": "Product Name #2",
"UnitPrice": 599
}
}
]
}
Once you’ve tested the template, press Save.
Template settings
After preparing your document template, configure the output filename and file type.
Go to the template settings and configure the following settings:
Enter an Output filename for the generated file. Use tokens to personalize it. For example,
Invoice {{InvoiceNum}}produces the filename Invoice 1 with our sample data.Leave HTML selected as the Output file type to generate an HTML invoice.
Note
To generate a PDF invoice from the same HTML template, select PDF as the Output file type. With PDF output selected, you can also add a watermark and protect the resulting PDF.
Switch the process to Production mode to remove Plumsail watermarks from resulting documents.
You can also add multiple templates to the same process to generate a set of documents in a single run.
Once all settings are configured, click Save.
Delivery
The next step is delivery. For demonstrating purpose, we’ll store the result file in OneDrive. But there are other options.
You need to connect to your OneDrive from the Plumsail account. After that, set the folder’s name where to save the ready document. Here you can use tokens as well.
You can configure as many deliveries as you need.
Start Process
Now everything is ready, and you can start generating HTML documents. Click Run process to see available options with a description for each.
You can start the process :
manually with your JSON data;
by Plumsail Web form bound to the process;
Use Power Automate or Zapier to connect the process with other apps. You can gather data from web forms, CRM systems, SharePoint lists, and other applications, then pass it to the process to populate the HTML template.